ユースケース: 雑につくったアプリを Cloudflare Pages にアップしたが、有象無象にアクセスされたくないので雑に認証をつけたい
毎回微妙に手順を忘れるので書いておく
まず Cloudflare Pages (以下 Pages) に Cloudflare Access (以下 Access) をつけるとき、 Access 側のページからは設定できない。かわりに、 Pages から Manage タブ > Access Policy のとこから "Enable access policy" をクリックして設定をはじめる。
Access 側では、デフォルトのドメイン設定だと preview のページにしかアクセス制限がかからないので、subdomain なしのドメインを追加する。
ここまでやれば、 email x OTP でのアクセス制限はかけられる。なんだけど、Access からメールが来るのにやたら時間がかかるので Google 認証もつけたい。 Google 認証はアプリケーション単位ではなく、 Cloudflare のアカウント単位で設定するもので、 Access の Settings ページからやる。
手順はここ↓ で、 GCP 側に OAuth consent screen と OAuth client をつくる。
consent screen のポイント:
- user type: External
- authorized domains: client を作るときに勝手に追加されるので、consent screen を作るときに設定しなくて ok
- scopes:
.../auth/userinfo.emailを追加するといいよ、と上の docs に書いてある - test users: ... はいらない (これも docs に書いてある)
OAuth client のポイント:
- type: Web application
- origin/redirect URI: docs に書いてある & ためしに Cloudflare Access のログイン画面を自分のアプリに行って開けばわかる
ここまでやったら Cloudflare Access 全体の設定に Google が IdP として追加されたので、最後に Pages の Access に Google を追加する。
