Cloudflare Workersを試す

2021/11/15

Cloudflare Workers

巷で話題の Cloudflare Workers をいつも通り、触りだけ試す

どういうワーカーをサンプルで作ろうかと悩んで、一時期話題になってた偶数かどうか教えてくれるネタAPI、 isEven API を作ることにした

手順

Wrangler のインストール

WranglerというCLIツールで開発やデプロイをする

$ yarn global add @cloudflare/wrangler
$ wrangler --version
wrangler 1.19.4

認証

$ wrangler login

ブラウザが開くので認証を済ませる

✨  Successfully configured. You can find your configuration file at: /Users/ytkg/.wrangler/config/default.toml

プロジェクト作成

テンプレートがいくつか用意されているので、今回はTypeScriptのテンプレートを使ってプロジェクトを作成する

wrangler generate is-even-api https://github.com/cloudflare/worker-typescript-template

$ cd is-even-api
$ yarn

サーバー起動

$ wrangler dev

$ curl http://127.0.0.1:8787
request method: GET

$ curl -X POST http://127.0.0.1:8787
request method: POST

リクエストメソッドを返してくれるものがデフォルトで実装されている

実装

src/handler.ts に処理が書かれているので、偶数かどうか true or false で返す処理に書き換える
バリデーションだったり、エラーハンドリングは省略する

src/handler.ts

export async function handleRequest(request: Request): Promise<Response> {
  const { pathname } = new URL(request.url)
  const value = Number(pathname.split("/")[1])
  const data = { iseven: value % 2 == 0 }

  return new Response(JSON.stringify(data, null, 2), {
    headers: { "content-type": "application/json;charset=UTF-8" },
  })
}

デプロイ

$ wrangler publish

$ curl https://is-even-api.ytkg.workers.dev/5
{
  "iseven": false
}

$ curl https://is-even-api.ytkg.workers.dev/6
{
  "iseven": true
}

特に詰まることなく、CLIのインストールから実装、デプロイまでできた

面白い題材が思いついたら使っていきたいと思う

補足

テスト

簡単なテストも書いた

test/handler.test.ts

import { handleRequest } from '../src/handler'
import makeServiceWorkerEnv from 'service-worker-mock'

declare var global: any

describe('handle', () => {
  beforeEach(() => {
    Object.assign(global, makeServiceWorkerEnv())
    jest.resetModules()
  })

  test('handle /5', async () => {
    const result = await handleRequest(new Request('/5', { method: 'GET' }))
    expect(result.status).toEqual(200)
    const json = await result.json()
    expect(json).toEqual({ iseven: false })
  })

  test('handle /6', async () => {
    const result = await handleRequest(new Request('/6', { method: 'GET' }))
    expect(result.status).toEqual(200)
    const json = await result.json()
    expect(json).toEqual({ iseven: true })
  })
})

$ yarn test
yarn run v1.22.11
$ jest --config jestconfig.json --verbose
 PASS  test/handler.test.ts
  handle
    ✓ handle /5 (4 ms)
    ✓ handle /6 (2 ms)

Test Suites: 1 passed, 1 total
Tests:       2 passed, 2 total
Snapshots:   0 total
Time:        0.885 s, estimated 2 s
Ran all test suites.
✨  Done in 1.58s.

wrangler test っていうコマンドが見つからなかったので、 yarn test で実行したけど合ってるのかわからない

開発中も無料枠を消費する

wrangler dev はローカルでサーバー起動していると思ったら、実際にはプライベートのワーカーにデプロイして localhost から繋がるようにしているだけなので、しっかり無料枠（1日10万リクエストまで）を消費していた

個人開発レベルだと全然問題なさげだけど、気になるようだったら Miniflare (https://miniflare.dev/) というローカルで Cloudflare Workers の実行環境を再現できるものがあるのでこれを使うと良いかも

リポジトリ

今回作ったAPIのリポジトリ
https://github.com/ytkg/is-even-api

高木のブログ