前々からCloudflareを学びたいと思ってましたがなかなか機会がなく。
ちょうど製作中のサイトがあったので、こちらをCloudflare環境で運用しようとふと思いました。
はじめに
ちなみになぜCloudflareをやってみたいかというと、
・AWS以外にサイト運用する選択肢を広げたい
・Terraformで構築してTerraform慣れしたい
・テック系の記事でよく見かけて気になってた
・JamstackやCDNをもっと学んでいきたい
といった理由があります。
特に”AWS以外に”というのは個人開発にとって重要で、サクっと環境を作りたいとかコストを抑えたい場合に他のプラットフォームが選択肢にあるのは強みになります。
AWSは沢山のサービスがあって構成を考えるのは楽しいですが、個人が月々に支払う程度の予算感にあった構成となると使えるサービスが限られてきます。結局は安価なLightsailやDynamoDB&APIGateway&Lambdaといったサーバレスになりがちかなと。
そういうわけでコンテンツ配信に特化したCloudflareに入門してみます
ドメイン買った
とりあえず公開に使うためのドメインを先に買いました。形から入るタイプです！
クレジットカード入力→購入、と特に躓くことはありませんでした。
購入完了後、左メニューの[Webサイト] →ドメインを選択→[DNS]から買ったドメインの設定画面にいけます。各レコードは↓で設定する模様
カスタムドメインは[Pages]からプロジェクト（SPAやSSGなど）を追加してから割り当てるようで、サイトのデプロイ自体はベタな内容なので省略。
→設定から30分くらいしたら反映されました。デフォルトでhttpsになってて良い感じです。
メール受信が便利
左メニューの[DNS]の下にある[メールアドレス ベータ版]がふと気になりました。
どうやらドメインに対して受信したメールを他のメールアドレス（例えばGmailとか）に転送してくれるらしい。AWSのSESやSNSと違ってシンプルです。
SPFやDKIMも[DNS]ページから設定できるようです。
↓モンタリングもわかりやすい
デフォルトドメインのアクセス制御
とりあえずプロジェクト作成時のデフォルトドメインをアクセスできないようにしたくなります。
リダイレクトの設定でデフォルトドメイン→カスタムドメインにできそうと思ったら、まだSupportがNoになってました。近々できるようになるんですかね。
https://developers.cloudflare.com/pages/platform/redirects
いよいよWorkersをやってみようと思ってリダイレクトについてググったところ、クラスメソッドの下記記事を見つけました。一括リダイレクトならドメインを指定することが出来るらしい
とりあえずこの時点で、
1. ドメインの取得
2. ドメインの設定
3. サイトのデプロイ（NextJSのSSGですが割愛します）
4. デフォルトドメイン→カスタムドメインへのリダイレクト
まで出来ました。
最後に、サイトはまだ出来てないのでメンテページでも出しておきます。
さっきの一括リダイレクトでも問題なさそうですが、下記の方式でやってみました。
https://developers.cloudflare.com/pages/platform/redirects
_redirectsというファイルをビルド成果物のディレクトリ直下に置けば読み込まれるとのこと。
ビルドの設定で_redirectsファイルを取り込めるかどうかはFWによると思いますが、面倒なので少し横着します。
まずプロジェクトルートにこんな感じで_redirectsを作成します。パスは自分の良いように置き換えてください。ワイルドカードを使う場合はリダイレクトループに注意。
/index.html /maintenance.html 302
次にビルドコマンドの最後にcpコマンドでビルド成果物のディレクトリに_redirectsを置きます。
NextJSの場合）
これで再度デプロイしてリダイレクトが効けば成功です。
思ったより長くなったので今日はこの辺で。
Terraformで色々やってみようと思ったけど、まずは画面で一通り覚えないとだめかなー。
あとCodepipelineに比べてNextJSのビルドが思ったより早くてうれしい
