Cloudflare는 최근 Cloudflare 작업자를 위한 Upstash 통합을 출시했습니다. 이를 통해 Workers에서 Upstash 제품을 더욱 쉽게 사용할 수 있습니다. 이 블로그 게시물에서는 Upstash Redis 통합을 사용하여 서버리스 URL 단축기를 구축하겠습니다.
시작하기
이 프로젝트를 구축하는 단계는 다음과 같습니다:
- Upstash 데이터베이스 설정
- Cloudflare에서 작업자 생성
- Cloudflare Workers를 Upstash와 통합
- 프로젝트 알고리즘을 구현합니다.
- 애플리케이션 배포
데이터베이스 생성
Upstash 콘솔로 이동한 후 데이터베이스 생성을 클릭하여 Redis 데이터베이스를 직접 생성하세요. Redis의 버튼 섹션.
이렇게 하면 데이터베이스가 모두 설정되었습니다!
Cloudflare 작업자 생성
Cloudflare CLI 도구를 사용하여 작업자를 생성하겠습니다. 그것은 매우 간단한 과정입니다. 터미널을 열고 아래 명령을 입력하세요:
npm create cloudflare@latest
이 명령을 실행하면 애플리케이션에 대한 옵션과 구성을 안내하게 됩니다. 마지막으로 Cloudflare에 로그인하라는 메시지가 표시됩니다. 다음은 내 구성 및 결과 출력의 예입니다.
한 줄 명령을 사용하여 애플리케이션을 만들고 배포했습니다. 이 명령은 다음과 유사한 폴더를 초기화해야 합니다:
/url-shortenersrc
└── worker.ts
node_modules
package-lock.json
package.json
tsconfig.json
wrangler.tomlUpstash 통합을 활성화하는 것도 마찬가지로 간단합니다.
Cloudflare - Upstash 통합
Cloudflare Dashboard에 액세스하고 url-shortener를 생성한 것과 동일한 계정으로 로그인하세요. 신청. 그런 다음 작업자 및 페이지> 개요로 이동합니다. 사이드바 섹션. 여기에서 url-shortener를 찾을 수 있습니다. 애플리케이션이 나열됩니다.
애플리케이션을 클릭하면 통합 프로세스를 수행할 애플리케이션 세부정보 페이지로 이동됩니다. 설정으로 전환하세요. 애플리케이션 세부정보 탭을 탭하고 통합으로 진행하세요. 섹션. 다양한 작업자 통합이 나열되어 있는 것을 볼 수 있습니다. 계속하려면 통합 추가를 클릭하세요. Upstash Redis와 관련된 버튼입니다.
통합 페이지에서 Upstash 계정에 연결하세요. 그런 다음 url-shortener을 선택하세요. 드롭다운 메뉴에서 데이터베이스를 선택하세요. 저장 버튼을 눌러 프로세스를 마무리하세요. .
참고: 비밀번호 구성에서 비밀번호 이름을 변경하지 마세요. 단계. 이 자격 증명은 Redis.fromEnv(env)에 자동으로 선택됩니다. 코드에서 UPSTASH_REDIS_REST_URL로 된 줄 및 UPSTASH_REDIS_REST_TOKEN .
URL 단축기 구현
우리의 구현은 다소 간단할 것입니다. 두 가지 기능이 있습니다:
-
POST 메서드를 사용하여 URL이 전송되면 무작위로 생성된 키가 해당 URL에 할당됩니다. 이 키-URL 쌍은 검색을 위해 Redis에 저장됩니다. 키는 작업자 URL에 대한 경로로 추가되고
<YOUR_WORKER_URL>/<KEY>의 사용자에게 전송됩니다. 형식입니다. -
사용자가 이전에 추가된 키를 경로로 사용하여 작업자 URL에 액세스하면 해당 키 값이 Redis에서 검색됩니다. 그러면 사용자는
307를 사용하여 이 URL로 리디렉션됩니다. 응답 코드입니다.
src/worker.ts에서 애플리케이션을 구현하겠습니다. 파일. 다음은 URL 단축기의 기본 구현입니다:
import { Redis } from "@upstash/redis/cloudflare";
export interface Env {
UPSTASH_REDIS_REST_URL: string;
UPSTASH_REDIS_REST_TOKEN: string;
}
export default {
async fetch(
request: Request,
env: Env,
ctx: ExecutionContext,
): Promise<Response> {
const redis = Redis.fromEnv(env);
/*
generateRandomKey function returns a 7 digit alphanumerical key.
If an identical key exists in Redis, it will create new key.
*/
async function generateRandomKey(): Promise<string> {
const key: string = btoa(
crypto.getRandomValues(new Uint8Array(2)).toString(),
).replaceAll("=", "");
if (await redis.exists(key)) {
return generateRandomKey();
}
return key;
}
/*
If the request method is POST, "longUrl" field will be extracted from
the request body and new key will be generated for this url.
Then, this key-value pair will be persisted to Redis.
*/
if (request.method === "POST") {
const requestUrl = request.url;
const body = await request.text();
const { longUrl } = JSON.parse(body);
const key = await generateRandomKey();
redis.set(key, longUrl);
const responseUrl = requestUrl + key;
return new Response(responseUrl);
}
const slug: string = request.url.split("/").pop() || "";
const url = (await redis.get(slug)) as string;
/*
If the slug exists in the Redis DB as key, user will be redirected to URL in the value.
If the slug doesn't exist in the Redis, or it doesn't exist at all,
an error will be returned.
*/
if (url) {
return Response.redirect(url, 307);
} else {
const errorText = !slug
? "Please provide a slug."
: `Slug ${slug} not found. `;
return new Response(errorText, { status: 404 });
}
},
};
이제 알고리즘이 준비되었으므로 애플리케이션 배포라는 한 단계만 남았습니다. url-shortener으로 이동 폴더를 열고 아래 명령을 실행하세요:
npm run deployCloudflare Worker가 이제 실행 중입니다! 애플리케이션 대시보드나 컬 요청을 통해 테스트할 수 있습니다. 다음은 요청 예시입니다. URL을 작업자 URL로 바꾸거나 내 구현으로 테스트할 수 있습니다:
curl -X POST https://url-shortener.fahreddin.workers.dev \
-d '{ "longUrl" : "https://google.com" }'응답 URL을 클릭하면 https://google.com으로 리디렉션됩니다. .
결론
튜토리얼을 따라해주셔서 감사합니다!
아시다시피 서버리스 기능과 Upstash Redis의 강력한 기능이 결합되면 프로젝트에 대한 가능성의 세계가 열립니다. 이 쌍의 다용성과 효율성을 통해 혁신적일 뿐만 아니라 반응성이 뛰어난 솔루션을 만들 수 있습니다.
이 가이드는 시작에 불과하다는 점을 기억하세요. 이 프로젝트를 확장하고 개선할 수 있는 방법에는 제한이 없습니다.
질문이나 문제가 있으면 언제든지 fahreddin@upstash.com으로 연락해 주세요.
즐거운 코딩 되세요!