こんにちは。
クラウド事業推進部の野中です。
7月12日に開催されたCloudflare Meetup Kyoto Kick Off!に参加してきました。

今回はフェンリルの京都オフィスでの開催となりました。

私自身こういったイベントに参加するのは初だったのですが、フェンリルのオフィスで開催となると少し参加するハードルが下がるような気がしております。

実は私、この Meetup に参加するまで Cloudflare についてあまり知りませんでした。
なので今回のブログでは Cloudflare について、初心者目線で初めて分かったことや、感じたこと、少し調べたことについて共有できればと考えております。
後半では Cloudflare Workers のハンズオンとしてアカウント作成、デプロイ、削除も実施しております。

Cloudflare Workers とは

今回はCloudflareといっても色々あるみたいなので、Cloudflare Workers に絞って記載させて頂きます。
まず、はじめに Cloudflare を聞いたことない、知らない人向けに、Cloudflare Workers とは何？というところから書いていこうかと思います。私もそんな感じでした...

一言でいうと、「サーバーレスのコンピューティング環境」でしょうか。
Cloudflare Workers は Cloudflare のエッジコンピューティングプラットフォームで、非常に多様な言語で書かれたプログラムをグローバルネットワーク上で実行できるようにするサービスです。
ただし、基本的には JavaScript でコードを実行するのが前提となっており、他の言語を使うにはWebAssembly を使う必要があります。
比較対象になるサービスですが、AWS で言うと、CloudFront Functions が近そうです。
ここまで読んで、グローバルネットワークで実行？リージョンは？と疑問に思った方もいるのではないでしょうか。

実は Cloudflare Workers ではリージョンという概念がありません。
Cloudflare Workers は特定の地理的な場所に限定された場所で実行されるわけではなく、Cloudflare のグローバルネットワークを利用しています。
そのため、実際の実行環境は世界中に設置したデータセンターに分散しています。
この分散型アーキテクチャにより、エンドユーザに対して高速で安定したパフォーマンスを提供する仕組みになっています。

実際の案件等で使用する場合、ここが一番のハードルになりそうですね...
ただ、日本国内でデータを保持する必要がない場合は選択肢に入るサービスだと感じました。とにかくデプロイが早い!!
また、サーバレスでコードを実行する場合、コールドスタートが発生するのが一般的ですが Cloudflare Workers ではコールドスタートが起きないように設計されているため、コールドスタートが許容できないがサーバレスでコードを実行したい場合等が実際のユースケースになりそうです。

アカウント作成

まず、Cloudflare Workers を使うにあたって必要になるのが Cloudflare のアカウントです。

Cloudflareトップベージからサインアップを選択し、指示に従っていけば作成できます。Cloudflare の良心的なところとして Cloudflare Workers を試すくらいであればクレジットカード登録不要です。
クレジットカードを登録しない範囲でお金を気にせず色々試せるのは良いですね。

次に、なるべくですが二段階認証も設定しておきましょう。

私の場合すでに設定しているので再構築となっていますが、こちらを選択し設定すればOKです

Cloudflare では自分のアカウントにメンバーを招待できたりもしますので、その際はメンバーアカウントに MFA を必須にする設定もあるので合わせて設定をお勧めします。

ローカル環境整備

今から Cloudflare Workers のデプロイハンズオンについて記載いたしますが、前提として MacBook Pro M2 のローカル環境(ターミナル)で実行しています。
Windows OS 等をお使いの方は別途対応が必要な場合がありますのでご注意下さい。

Cloudflare Workers のデプロイには、node.js 、Wrangler が必要になりますのでインストールを実施していきます。

現在のローカル環境にnode.jsが入っていない場合インストールが必要です。
私の場合、バージョン指定が楽なので nodebrew でのインストールをしております。

インストール後 node -v で18以上のバージョンが返ってくればOKです。

次に、Workers の作成に必要になってくるのが Wrangler のインストールです。
WranglerとはCloudflare Workersのコマンドラインツールで、デプロイの他にもWorkersに関連するサービスの操作も行えたりします。
npm install -g wrangler でインストール可能です。

Wrangler のバージョン3のインストールにはpython3が必要です。
Wrangler のバージョン2まではpython3は不要なので、ローカル環境にpython3が入っていない方は npm install -g wrangler@2.xx.x にてバージョン2をインストールすればOKです。
ちなみに -g オプションを使うことでグローバルにインストールができます。
wrangler -v でバージョンが返ってくればインストールができている状態です。

Workers作成

次にCloudflareアカウントにログインします。
wrangler login を実行すると、自動でCloudflareのログイン画面に遷移しますのでアカウントとパスワードを入力します。
MFAを設定している場合、そちらも入力し、許可画面が表示されるので「Allow」を選択します。
ブラウザに「You have granted authorization to Wrangler!」が表示されていればCLIでのログインが完了です。

wranger whoami にてユーザ情報の確認が行えます。

続けて、作業ディレクトリにてプロジェクトの作成を行います。
wranger init を実行すると作業ディレクトリ配下にプロジェクトが作成されます。
プロジェクトディレクトリ配下には必要な設定ファイルや、src/index.jsが作られます。

デフォルトではHello World!"が表示されるようになっているので、今回はそのままデプロイしてみます。
作成したプロジェクトのディレクトリに移動し、wrangler publish を実行します。
サブドメインを作成していない場合、サブドメインを入力し、プロンプトに表示されたURLにアクセスすると Hello World! が表示されます。
これでデプロイ完了です。凄く簡単ですよね。

Cloudflare にログインしてみるとコンソール上でもデプロイしたプロジェクトがみれます。

Workers削除

次に、作成したプロジェクトの削除についてです。
削除対象のプロジェクトディレクトリに移動して wrangler delete を実行します。
「Are you sure you want to delete Workersname? This action cannot be undone.」と削除するプロジェクトが聞かれるので y を入力すると削除できます。
前述した通りクレジットカードを登録していない範囲での操作では料金は発生しませんが、不要なプロジェクトは削除しておきます。