Zenn
🀄

【PoC 用】Access アプリケーション（HTTP Self-hosted）の作成

2024/10/13に公開
Cloudflare
PoC
tech

Access アプリケーション（HTTP Self-hosted）の作成は下記の要領で行います。
基本的な構成で、その効果と価値を把握します。

事前準備

取りかかる前に、下記の材料を揃えます。

ゾーン・IdP・cloudflared

決め事

内容 例
公開ホスト名 www.example.com
cloudflared が接続する HTTP アプリケーション URL
スキーム://ホスト名_or_IPアドレス:ポート 		https://192.0.2.1:443
指定した URL に cloudflared が稼働するサーバーから実際に接続でき、かつ、期待した応答を得られることが必須条件

デザイン

アプリケーション（ Self-hosted ）の作成

設定の流れ（1分）

Access > Applications

Add an application

Self-hosted

Configure application

Application Configuration

設定項目 内容
Application name アプリケーションの識別名
Application domain Subdomain サブドメイン（www など、公開する名前）
Application domain Domain ドメイン（登録ずみのゾーンからプルダウンで選択）
Identity providers

設定項目 内容
Identity providers One-time PIN を外し、登録済み IdP だけを選択
> Next

Add policies

Policy name

設定項目 内容
Policy name ポリシーの識別名
Configure rules

設定項目 内容
Configure rules Include で Login Method 登録済み IdP を選択
> Next

Setup

デフォルトのまま > Add application


完了

トンネルとアプリケーションの紐付け

Networks > Tunnels

Tunnel Name をクリック

トンネルが Healthy なこと

Edit

Public Hostname > Add a public hostname

Public hostname（Subdomain, Domain）および Service（Type, URL）

公開ホスト名と cloudflared の接続先 HTTP アプリケーション

完了

うまくいけば

Access ログイン画面が表示

IdP にて認証

アプリケーションに接続

認証に問題がないのに接続ができなければ cloudflared かその先が問題の可能性があります。

ヘッダーやボディの書き換え

内部ホスト名と公開ホスト名が異なるケースでは、その不整合でアプリケーションが期待通りに動かないことがあります。アプリケーション側で公開ホスト名に対応するのが望ましいですが、難しい場合、Cloudflare のプロキシーで変換の対応が可能です。
Rules（ダッシュボード）や Workers 、Snippets を用途によって選択できます。

対象 Workers
Snippets（2024年10月時点 Beta）		 Rules
ヘッダー o
Headers 		o
リクエストヘッダーの書き換え
レスポンスヘッダーの書き換え
ボディ o
HTMLRewriter
サンプル
Snippet 使用例 		x

たとえば、内部ホスト名で設定した Wordpress を Access で公開ホストにした際は下記のような項目を Workers でリライトしていました。

方向 対象 内容
リクエスト ヘッダー referer
レスポンス ヘッダー location, link, x-pingback
レスポンス ボディ content-type:text/* の場合

以上になります。

お困りことやご要望、応用的な機能については PoC 担当者までご相談下さい。

Discussion