Skip to content

Cloudflare

  • 最終更新日: 2026年10月13日
  • 最終更新者: 都築

概要

本文書では、Cloudflare Platformでの運用手順等を記載します。

Cloudflare PageにEntra認証付きサイトを構築

1.Cloudflare Pagesの確認

dashboardの[Compute]-[Workes&Pages]よりCloudflare PagesのURLを確認

2.EntraとのSSO登録

  1. dashboardの[ZeroTrust]をクリック。
  2. Entra ID側で「アプリの登録」を行う
  3. Microsoft Entra 管理センター(または Azure ポータル)に管理者アカウントでサインインします。
  4. 左メニュー 「ID」 > 「アプリケーション」 > 「アプリの登録」 を開き、「新規登録」 をクリックします。
    • 設定内容:名前: 任意(例: Cloudflare Access)
    • サポートされているアカウントの種類: 「この組織のディレクトリ内のアカウントのみ(シングル テナント)」 を選択
    • リダイレクト URI:
  5. 「登録」 をクリックします。
  6. 作成後の「概要」画面から以下の2つの値をコピーして控えます:
    • アプリケーション (クライアント) ID
    • ディレクトリ (テナント) ID
  7. クライアントシークレットを発行する:
  8. 先ほど登録したアプリ画面の左メニューから 「証明書とシークレット」 を開きます。
  9. 「クライアント シークレット」 タブ > 「新しいクライアント シークレット」 をクリックします。
  10. 説明(例: cloudflare-access-secret)と有効期限(例: 180日や24か月)を設定し、「追加」 をクリックします。
  11. 一覧に表示された 「値 (Value)」 をコピーして手元に控えます(※この画面を離れると二度と表示されません)。
  12. Cloudflare Zero TrustにIdPを追加する:
  13. Cloudflare Zero Trust ダッシュボードに戻ります。
  14. 左メニュー 「Settings」 > 「Authentication」 を開きます
  15. 「Login methods」セクションの 「Add new」 をクリックし、一覧から 「Azure AD / Microsoft Entra ID」 を選択します。
  16. 必要情報を入力します:
    • Name: ログイン画面に表示される識別名(例: Microsoft 365 や Entra ID)
    • Application ID: ステップ2で控えた クライアント ID
    • Application secret: ステップ3で控えた シークレットの値
    • Directory (Tenant) ID: ステップ2で控えた テナント ID
  17. 「Save」 をクリックします。
  18. 追加された Entra ID の横にある 「Test」 をクリックし、Microsoftの認証画面を経て「Success」と表示されることを確認します。

3. workersに設定

  1. Scope の確認
  2. All traffic が選択されている状態(現在のまま)にしておきます。これにより本番トラフィック全体が認証対象になります。
  3. ポリシーの選択
  4. 一覧の 「Email domain」(Anyone with a verified address from your domain can sign in.)をクリックします。
  5. ドメインの入力
  6. 入力欄が表示されたら、許可したいメールドメインを入力します:vt-holdings.co.jp(※@ は付けずに入力します)
  7. 保存
  8. 右下の青い保存ボタン(「Save」等)をクリックします。

保存後の動作確認 1. ブラウザのシークレットウィンドウ(InPrivateウィンドウ)を開きます。 1. サイトのURL(https://dawn-moon-2989.workers.dev)にアクセスします。 1. Cloudflareのログイン画面が表示され、先ほど連携した Microsoft Entra ID でのログイン、または @vt-holdings.co.jp 宛の認証が求められることを確認してください。

なお、上記のSSO認証設定は、Cloudflare Pages以外にも、同様に設定すれば利用できると思います。

Cloudflare PagesにGithubにホストしたMkDocsリポジトリを公開

  1. dashboardから、[Compute]-[Workes&Pages]をクリック。
  2. [Create Application]をクリック
  3. 下のほうにある「Continue to Pages」をクリック
  4. [Drag and drop your files]の[Get started]をクリック。(まずはサイト名を確定させるため、この時点ではGitには接続しません。)
  5. Project name を指定します。
  6. siteフォルダにテスト用のhtmlを作成し、siteフォルダごとドロップして[Deploy site]をクリック。
  7. テスト用のhtmlが表示されることを確認し、
  8. dashboardから、[Zero Trust]をクリック。
  9. [Access control]-[Applications]をクリック。
  10. [+ Create new application]をクリック。
  11. [Self hosted and private]タブで[Continue with Self hosted and private]をクリック
  12. Subdomain: (未指定)
  13. Domain: (上で決めたProject name)-3cw.pages.dev を選択
  14. Path: (未指定)
  15. Access policies: Email domain: (Entraのドメイン) を選択
  16. [Create]をクリック
  17. Applications の一覧に戻るので、表示されるURLにブラウザのゲストモードでアクセスし、Entraによる認証を求められることを確認。
  18. dashboardから、[Compute]-[Workes&Pages]をクリックして、先ほど作成したテスト用サイトをクリック。
  19. [Settings]-[Build]-[Git repository]の[Connect]をクリックし、以下の通り入力して[Connect]をクリック。
    • Git account: (リポジトリの所有アカウント)
    • Repository: (対象リポジトリを指定)
    • Production branch: main
    • Framework preset: None
    • Build command: bash pip install mkdocs-material mkdocs-awesome-pages-plugin && mkdocs build
    • Build output directory: site
  20. [Variables and secrets]で[Add]をクリックして以下を入力し、[Save]をクリック。
    • Type: Text
    • Variable name: PYTHON_VERSION
    • Value: 3.14
  21. Deployments タブでビルドが成功していることを確認。再度、URLにアクセスしてビルド結果が表示されることを確認。

以上です。