Cloudflare Workers 初心者ガイド

はじめに

サーバー管理なしでモダンなWebアプリケーションを構築したい場合、Cloudflare Workersは単純なサーバーレス関数をはるかに超える魅力的なソリューションを提供します。従来のプラットフォームとは異なり、Workersは現在、フルスタックアプリケーションに必要なすべてを提供しています。D1によるSQLデータベース、Hyperdriveを介した既存のPostgreSQLやMySQLへの接続、静的アセットホスティング、そして広範なNode.js互換性—これらすべてがエッジで、ユーザーの近くで実行されます。

このCloudflare Workersチュートリアルでは、エッジベースの実行の理解から、モダンなデータベース接続とアセット管理を備えた完全なアプリケーションの構築まで、開始するために必要な基本的な概念とツールを取り上げます。

Cloudflare Workersとは?

エッジベース実行の説明

Cloudflare Workersは、Cloudflareのグローバルデータセンターネットワーク上で実行されるJavaScript、TypeScript、Python、またはRust関数です。単一のサーバーで実行される代わりに、コードは各ユーザーに最も近いエッジロケーションで実行され、通常、地球上のどこからでも50ミリ秒以内でアクセス可能です。

このエッジベースモデルは、リクエストが中央サーバーに移動する必要がないため、アプリケーションの応答が高速になることを意味します。プラットフォームは自動的にスケーリングを処理します。10人のユーザーでも1000万人のユーザーでも、Workersは設定なしで調整します。

コアコンセプト:バインディングと環境

Workersはバインディングを使用してコードをリソースに接続します。これらは従来の環境変数ではなく、サービスへの直接接続です:

• KVネームスペース - キーバリューストレージ用
• D1データベース - SQL操作用
• R2バケット - オブジェクトストレージ用
• サービスバインディング - 他のWorkersへの接続用
• Hyperdrive接続 - 外部データベース用

各バインディングは、Workerに渡されるenvオブジェクトのプロパティとして表示されます:

export default {
  async fetch(request, env, ctx) {
    // D1データベースへのアクセス
    const result = await env.DB.prepare('SELECT * FROM users').all()
    return Response.json(result)
  }
}

Cloudflare D1データベースによるモダンなデータベースオプション

D1:エッジでの本番環境対応SQL

Cloudflare D1データベースは、自動レプリケーションとバックアップを備えたSQLiteをエッジにもたらします。従来のサーバーレスデータベースとは異なり、D1はWorkersと同じロケーションで実行されるため、データベースクエリのネットワークレイテンシが解消されます。

D1データベースの作成は簡単です:

npx wrangler d1 create my-database
npx wrangler d1 execute my-database --file=./schema.sql

Workerはバインディングを通じてD1にアクセスし、クエリがローカルのように感じられます:

const user = await env.DB.prepare('SELECT * FROM users WHERE id = ?')
  .bind(userId)
  .first()

既存データベース向けのHyperdrive接続

Hyperdrive接続は、一般的な課題を解決します:プライベートネットワーク内のものを含む、既存のPostgreSQLまたはMySQLデータベースへのWorkersの接続です。HyperdriveはCloudflareのエッジで接続プールを維持し、接続オーバーヘッドを最大30倍削減します。

Hyperdriveのセットアップには最小限の設定が必要です:

npx wrangler hyperdrive create my-postgres \
  --connection-string="postgresql://user:pass@host:5432/db"

その後、WorkerはHyperdrive接続で使い慣れたデータベースライブラリを使用します:

import { Client } from 'pg'

export default {
  async fetch(request, env) {
    const client = new Client(env.HYPERDRIVE.connectionString)
    await client.connect()
    const result = await client.query('SELECT * FROM products')
    return Response.json(result.rows)
  }
}

フルスタックアプリケーションの構築

Workers静的アセットとルーティング

Workers静的アセットにより、別途ホスティングの必要がなくなります。HTML、CSS、JavaScript、画像がAPIコードと一緒にデプロイされます。プラットフォームは適切なキャッシュヘッダーと圧縮を使用して静的ファイルを自動的に提供します。

静的アセットの処理には、publicディレクトリを指すwrangler.tomlのassetsエントリが必要です。

フルスタックWorkerのプロジェクト構造:

my-app/
├── src/
│   └── index.js        # Workerコード
├── public/
│   ├── index.html      # 静的アセット
│   ├── style.css
│   └── app.js
└── wrangler.toml       # 設定

ルーティングは静的リクエストと動的リクエストの両方を処理します:

export default {
  async fetch(request, env, ctx) {
    const url = new URL(request.url)
    
    if (url.pathname.startsWith('/api/')) {
      // APIルートを処理
      return handleAPI(request, env)
    }
    
    // 静的アセットを提供
    return env.ASSETS.fetch(request)
  }
}

Node.js互換性レイヤーのメリット

Node.js互換性レイヤーにより、数千のnpmパッケージがWorkersで動作するようになります。Web標準APIのみをサポートしていた初期バージョンとは異なり、Workersは現在、Buffer、crypto、stream、pathなどのNode.js組み込みモジュールをサポートしています。

wrangler.tomlでNode.js互換性を有効にします:

compatibility_flags = ["nodejs_compat"]

この互換性により、既存のNode.jsコードは最小限の変更で動作することが多く、従来のサーバーからの移行が簡単になります。

ローカル開発ワークフロー

環境のセットアップ

CloudflareのCLIツールであるWranglerから始めます:

npm create cloudflare@latest my-app
cd my-app
npm run dev

Wranglerは、すべてのバインディングにローカルでアクセスできるホットリロード開発を提供します。D1データベース、KVネームスペース、さらにはHyperdrive接続も開発モードで動作します。

テストとデプロイ

ローカル開発サーバーは本番環境の動作を模倣します:

# ローカルD1データベースでテスト
npx wrangler d1 execute DB --local --file=./seed.sql

# 本番環境へデプロイ
npm run deploy

その他のプラットフォーム機能

このチュートリアルはコアコンセプトに焦点を当てていますが、Workersは探索する価値のある追加機能を提供しています:

• Queues - バックグラウンドジョブ処理用
• R2イベント通知 - オブジェクトストレージトリガー用
• 段階的デプロイメント - 安全なロールアウト用
• Workers Analyticsと構造化ログ - 可観測性用

これらの機能は、アプリケーションの成長に合わせてシームレスに統合されます。

まとめ

Cloudflare Workersは、シンプルなエッジ関数からモダンなWebアプリケーション向けの完全なプラットフォームへと進化しました。サーバーレスSQL用のD1、既存のデータベース接続用のHyperdrive、組み込みの静的アセットホスティング、包括的なNode.js互換性により、最小限の設定でグローバルに実行されるフルスタックアプリケーションを構築できます。

シンプルなWorkerから始め、データ永続化のためにD1データベースを追加し、必要に応じてHyperdriveやR2などの機能を段階的に組み込んでいきます。プラットフォームはグローバル配信の複雑さを処理し、アプリケーションの構築に集中できるようにします。

よくある質問

Gain Debugging Superpowers

Unleash the power of session replay to reproduce bugs, track slowdowns and uncover frustrations in your app. Get complete visibility into your frontend with OpenReplay — the most advanced open-source session replay tool for developers. Check our GitHub repo and join the thousands of developers in our community.