Cloudflare Workers + Hono + Cloudflare D1を使って、CDNエッジのみで動くWebAPIを作ってみた

npm install -g wrangler
npx wrangler login
mkdir cloudflare-advent-calendar-16
cd cloudflare-advent-calendar-16
npx wrangler init -y

npm install hono

npm install --save-dev miniflare

import { Hono } from "hono";

const app = new Hono();
app.get("/", (c) => c.text("Hello World!!!"));

export default app;

npx wrangler dev

npx wrangler publish ./src/index.ts

npx wrangler d1 create qiita-advent-16

[[ d1_databases ]]
binding = "DB" # i.e. available in your Worker on env.DB
database_name = "qiita-advent-16"
database_id = "hogehoge"

npm install --save-dev @cloudflare/workers-types

export interface Env {
  DB: D1Database;
}

const app = new Hono<{Bindings: Env}>();

DROP TABLE IF EXISTS users;
CREATE TABLE users (
    id INTEGER PRIMARY KEY AUTOINCREMENT, 
    username TEXT NOT NULL,
    email TEXT NOT NULL,
    group_id INT,
    created_at TEXT NOT NULL DEFAULT (DATETIME('now', 'localtime')),
    updated_at TEXT NOT NULL DEFAULT (DATETIME('now', 'localtime'))
);

DROP TABLE IF EXISTS groups;
CREATE TABLE groups (
    id INTEGER PRIMARY KEY AUTOINCREMENT, 
    groupname TEXT NOT NULL,
    created_at TEXT NOT NULL DEFAULT (DATETIME('now', 'localtime')),
    updated_at TEXT NOT NULL DEFAULT (DATETIME('now', 'localtime'))
);

npx wrangler d1 execute qiita-advent-16 --local --file=./schema.sql

npx wrangler d1 execute qiita-advent-16 --command="select name from sqlite_master where type='table'"
┌─────────────────┐
│ name            │
├─────────────────┤
│ d1_kv           │
├─────────────────┤
│ users           │
├─────────────────┤
│ sqlite_sequence │
├─────────────────┤
│ groups          │
└─────────────────┘

npm install workers-qb

import { Hono } from "hono";
import { D1QB } from "workers-qb";

export interface Env {
  DB: D1Database;
}

const qb = new D1QB(env.DB);
const app = new Hono();

app.get("/", (c) => c.text("Hello World!!!"));

interface CreateUserBody {
  username: string;
  email: string;
  groupId: string;
}

app.post('/api/users', async c => {
  try {
    console.log('c', c);

    const body = await c.req.json<CreateUserBody>();

    const qb = new D1QB(c.env.DB);
    const inserted = await qb.insert({
      tableName: 'users',
      data: {
        username: body.username,
        email: body.email,
        group_id: body.groupId,
      },
    });
    return c.json(inserted);
  } catch (e) {
    console.error(e);
    throw e;
  }
});

app.get('/api/users/:id', async c => {
  console.log('c', c);

  const {id} = c.req.param();
  const qb = new D1QB(c.env.DB);
  const fetched = await qb.execute({
    query:
      'SELECT users.id, users.username, users.email, groups.groupname FROM users JOIN groups ON users.id = groups.id WHERE users.id = ?1',
    arguments: [id],
    fetchType: FetchTypes.ONE,
  });

  console.log('fetched', fetched);
  return c.json(fetched);
});

export default app;

npx wrangler dev --local --persist

curl -POST -H"Content-Type: application/json" "http://localhost:8787/api/users" -d'{
  "username": "sato.naoya",
  "email": "[email protected]",
    "groupId": 1,
}'

npx wrangler d1 execute qiita-advent-16 --local --command='SELECT * FROM users'
┌────┬────────────┬───────────────────────────┬──────────┬─────────────────────┬─────────────────────┐
│ id │ username   │ email                     │ group_id │ created_at          │ updated_at          │
├────┼────────────┼───────────────────────────┼──────────┼─────────────────────┼─────────────────────┤
│ 1  │ sato.naoya │ [email protected] │ 1        │ 2022-12-22 13:12:54 │ 2022-12-22 13:12:54 │
└────┴────────────┴───────────────────────────┴──────────┴─────────────────────┴─────────────────────┘

curl -H"Content-Type: application/json" "http://localhost:8787/api/users/1"
{"id":1,"username":"sato.naoya","email":"[email protected]","groupname":"test-group"}⏎

npx wrangler d1 execute qiita-advent-16 --command='SELECT * FROM users'

npx wrangler d1 execute qiita-advent-16 --file=./schema.sql

npx wrangler publish ./src/index.ts