실습 코드: sample-worker

이 강의의 cloudflare-workers-course/sample-worker/ 디렉터리에 들어 있는 예제 코드입니다. JS 코드는 아래 버튼으로 복사하거나 온라인 컴파일러(Node.js 환경)에서 실행해볼 수 있습니다. 단, env, ctx, Workers KV 같은 Cloudflare Workers 전용 API는 일반 Node.js 샌드박스에서는 동작하지 않으니 로직 확인용으로만 참고하세요.

`src/index.js`

js
/**
 * Cloudflare Workers 강의용 샘플 워커
 *
 * 라우트:
 *  GET  /            -> 환영 페이지 (HTML)
 *  GET  /api/hello   -> JSON 응답, env 변수 사용 예시
 *  GET  /api/visits  -> Workers KV를 이용한 방문 횟수 카운터
 *  그 외             -> 404 응답
 */
export default {
  async fetch(request, env, ctx) {
    const url = new URL(request.url);

    if (url.pathname === "/") {
      return new Response(renderHomePage(), {
        headers: { "content-type": "text/html; charset=UTF-8" },
      });
    }

    if (url.pathname === "/api/hello") {
      const body = {
        message: `${env.GREETING ?? "Hello"}, Cloudflare Workers!`,
        timestamp: new Date().toISOString(),
      };
      return Response.json(body);
    }

    if (url.pathname === "/api/visits") {
      return handleVisits(env);
    }

    return new Response("Not Found", { status: 404 });
  },
};

async function handleVisits(env) {
  if (!env.VISITS_KV) {
    return Response.json(
      { error: "VISITS_KV binding이 설정되지 않았습니다. wrangler.jsonc를 확인하세요." },
      { status: 500 }
    );
  }

  const current = await env.VISITS_KV.get("count");
  const next = (Number(current) || 0) + 1;
  await env.VISITS_KV.put("count", String(next));

  return Response.json({ visits: next });
}

function renderHomePage() {
  return `<!doctype html>
<html lang="ko">
  <head>
    <meta charset="UTF-8" />
    <title>Cloudflare Workers 샘플</title>
  </head>
  <body style="font-family: sans-serif;">
    <h1>Cloudflare Workers 샘플 프로젝트</h1>
    <ul>
      <li><a href="/api/hello">/api/hello</a></li>
      <li><a href="/api/visits">/api/visits</a></li>
    </ul>
  </body>
</html>`;
}

`wrangler.jsonc`

json
{
  "$schema": "node_modules/wrangler/config-schema.json",
  "name": "cloudflare-workers-course-sample",
  "main": "src/index.js",
  "compatibility_date": "2024-11-01",
  "vars": {
    "GREETING": "Hello"
  },
  "kv_namespaces": [
    {
      "binding": "VISITS_KV",
      "id": "REPLACE_WITH_YOUR_KV_NAMESPACE_ID"
    }
  ]
}

`package.json`

json
{
  "name": "cloudflare-workers-course-sample",
  "version": "1.0.0",
  "private": true,
  "description": "Cloudflare Workers 강의용 샘플 프로젝트",
  "scripts": {
    "dev": "wrangler dev",
    "deploy": "wrangler deploy"
  },
  "devDependencies": {
    "wrangler": "^4.0.0"
  }
}