なんじゃくにっき

プログラミングの話題中心。

Cloudflare D1 使い方

概要

CloudFlareで動くSQLiteであるCloudFlare D1を動かしていきます。

https://developers.cloudflare.com/d1/

注意点

現時点(2024年3月)でD1はベータバージョンです。

今後仕様が変わることもあります。手順もたまに少し変わっていたりします。

公式ドキュメントも読むことをオススメします。(但したまにドキュメント更新追いついてないのか違う挙動するときもあります)

また、データが吹き飛ぶ可能性もあります、と書かれているので本番DBに失って困る情報は書かないほうが良いでしょう。 (一応バックアップは取られてますが)

手順

プロジェクトを作成

wranglerのinstallが済んでいない場合は済ませておく。

Get started · Cloudflare D1 docs

Getting Startedに従っていきます

npx wrangler login
npm create cloudflare@latest project_name_hogehoge

選択肢がいくつか出るので答えていく

  • What type of application do you want to create?  -> "Hello World" Worker

  • Do you want to use TypeScript? -> Yes

  • Do you want to use git for version control? -> Yes

  • Do you want to deploy your application? -> No

deployのところだけはデフォルトYesからNoに変える。(これ紛らわしいのでデフォルトNoにしてほしい)

git

先程作ったプロジェクトと同名のプロジェクト名でgithubにプロジェクトを作る (このときgitignoreは作らないでおく)

remote追加

git remote add origin https://github.com/nanjakkun/project_name_hogehoge.git

localにmasterというブランチが出来ているのでmainに統合する

git fetch origin
git checkout main
git merge --allow-unrelated-histories master
git br -D master

DB作成(本番)

npx wrangler d1 create hogehoge_database

以下のような出力が出るので、手動でwrangler.tomlに追加して上げる必要がある。

[[d1_databases]]
binding = "DB" # i.e. available in your Worker on env.DB
database_name = "hogehoge_database"
database_id = "ddddddd-dddd-8888-aaaa-ffffffffff"

見逃した場合はWebのCloudflareのdashboardでdatabase_nameとdatabase_idを見て記入する。

database_idをリポジトリに上げたくない場合はwrangler.tomlをgitignoreに追加。

(もしかしたらsecretsから読み込ませる方法があるのかも)

SQL実行

schema.sql にファイルを作って

DROP TABLE IF EXISTS Customers;
CREATE TABLE IF NOT EXISTS Customers (CustomerId INTEGER PRIMARY KEY, CompanyName TEXT, ContactName TEXT);
INSERT INTO Customers (CustomerID, CompanyName, ContactName) VALUES (1, 'Alfreds Futterkiste', 'Maria Anders'), (4, 'Around the Horn', 'Thomas Hardy'), (11, 'Bs Beverages', 'Victoria Ashworth'), (13, 'Bs Beverages', 'Random Name');
npx wrangler d1 execute hogehoge_database --file=./schema.sql

本番で実行するときは --remoteを付けます。

以前はデフォルトで本番でlocalのときにオプション必要でしたが、デフォで本番はやっぱり危険なので変わったみたいです。

npx wrangler d1 execute hogehoge_database --remote --file=./schema.sql

ファイルじゃなくてSQLを直指定も可。

npx wrangler d1 execute hogehoge_database --command="SELECT 1"

Workersから呼び出す

src/index.tsを変更します

export interface Env {
    DB: D1Database
}

export default {
    async fetch(request: Request, env: Env, ctx: ExecutionContext): Promise<Response> {
      const { pathname } = new URL(request.url);

      var matched = pathname.match(/^\/(\d+)/)

      if (matched) {
            const { results } = await env.DB.prepare(
                "SELECT * FROM Customers WHERE CustomerID = ?"
            )
                .bind(matched[1])
                .all();

            return Response.json(results);
      }

      return new Response("Hello, world");
    },
};

ローカルサーバー立ち上げ

npm run dev

http://localhost:8787/1

にアクセスするとjsonが返ってくればOK!