コンテンツにスキップ

プレビュー展開

プレビュー展開を使用すると、プロジェクトの新しいバージョンを本番環境に展開することなくプレビューできます。プレビュー展開を表示するには:

  1. Cloudflareダッシュボードにログインし、アカウントを選択します。
  2. アカウントホームで、Workers & Pagesを選択します。
  3. プロジェクトを選択し、表示したい展開を見つけます。

GitHubリポジトリで新しいプルリクエストを開くたびに、Cloudflare PagesはユニークなプレビューURLを作成し、ブランチに新しいコミットをプッシュし続ける限り、それが更新されます。これは、プルリクエストがリポジトリ自体から発生する場合にのみ当てはまります。

たとえば、user-exampleというリポジトリがPagesに接続されている場合、user-example.pages.devというサブドメインが与えられます。mainがデフォルトのブランチである場合、mainブランチへのコミットは、プロジェクトに関連付けられた任意のカスタムドメインとともに、user-example.pages.devのコンテンツを更新します。

User-exampleリポジトリの展開状況とプレビュー

user-exampleを開発している間に、たとえばdevelopmentブランチに新しい変更をプッシュすることがあります。

この例では、新しいdevelopmentブランチを作成した後、Pagesはこれらの変更のために373f31e2.user-example.pages.devで利用可能なプレビュー展開を自動的に生成します - ここで373f31e2はランダムに生成されたハッシュです。

作成する各新しいブランチには、pages.devサブドメインの前に新しいランダム生成されたハッシュが付与されます。

User-exampleリポジトリの新しく生成されたプレビュー展開リンクと状況

developmentブランチへの追加の変更は、developmentブランチがmain本番ブランチにマージされるまで、この373f31e2.user-example.pages.devプレビューアドレスを更新し続けます。

カスタムドメインやuser-example.pages.devサイトは、プレビュー展開の影響を受けません。

プレビュー展開のアクセスをカスタマイズする

Cloudflare Accessを使用して、展開プレビューへのアクセスを管理できます。デフォルトでは、これらの展開URLは公開されています。アクセスポリシーを有効にすると、プロジェクトの展開をCloudflareアカウントに制限します。

有効にすると、マルチユーザーアカウントを設定して、チームの他のメンバーがプレビュー展開を表示できるようにすることができます。

デフォルトでは、プレビュー展開は有効であり、公開されています。プロジェクトの設定で、訪問者にプレビュー展開を表示するために認証を要求することができます。これにより、これらのプレビュー展開へのアクセスをチームメンバー、組織、またはアクセスポリシーを介して指定した他の誰かに制限できます。

Cloudflare Accessの背後でプレビュー展開を保護するには:

  1. Cloudflareダッシュボードにログインします。
  2. アカウントホームで、Workers & Pagesを選択します。
  3. 概要で、Pagesプロジェクトを選択します。
  4. 設定 > 一般に移動し、アクセスポリシーを有効にするを選択します。

これは、プレビュー展開(たとえば、373f31e2.user-example.pages.devおよび他のすべてのランダムに生成されたプレビューリンク)を保護するものであり、*.pages.devドメインやカスタムドメインには影響しないことに注意してください。

*.pages.devドメインとカスタムドメインをプレビュー展開とともにAccessを有効にしたい場合は、既知の問題を確認して手順を確認してください。

プレビューエイリアス

プレビュー展開が公開されると、ユニークなハッシュベースのアドレスが与えられます — たとえば、<hash>.<project>.pages.devのように。これらは原子的であり、将来的に常に訪問可能です。ただし、Pagesはgitブランチの名前のエイリアスも作成し、それを更新して、エイリアスが常にそのブランチの最新のコミットにマッピングされるようにします。

たとえば、developmentブランチに変更をプッシュすると(これは本番環境に関連付けられていない)、Pagesはabc123.<project>.pages.devに展開し、development.<project>.pages.devをそれにエイリアスします。その後、developmentブランチに新しい作業をプッシュすると、xyz456.<project>.pages.devの展開が作成されます。この時点で、development.<project>.pages.devエイリアスはxyz456展開を指しますが、abc123.<project>.pages.devは直接アクセス可能なままです。

ブランチ名のエイリアスは小文字にされ、非英数字の文字はハイフンに置き換えられます — たとえば、fix/apiブランチはfix-api.<project>.pages.devエイリアスを作成します。

Pagesプロジェクト内のブランチエイリアスを表示するには、任意のプレビュー展開のビルドを表示を選択します。展開の詳細には、その展開に関連付けられたすべてのエイリアスが表示されます。

プレビューエイリアスをカスタムドメインに添付するには、ブランチにカスタムドメインを追加することができます。