プルリクエストの Web プレビュー

Web プレビューは、開発チームや品質保証 (QA) チームに、コードをプロダクションブランチやインテグレーションブランチにマージする前に、プルリクエスト (PR) からの変更をプレビューする方法を提供します。プルリクエストを使うと、リポジトリ内のブランチにプッシュした変更を他の人に伝えることができます。プルリクエストが開かれたら、変更の可能性についてコラボレーターと話し合ったりレビューしたり、変更がベースブランチにマージされる前にフォローアップコミットを追加したりできます。

Web プレビューは、リポジトリに対して行われたすべてのプルリクエストを、メインサイトが使用している URL とはまったく異なる固有のプレビュー URL にデプロイします。Amplify CLI または Amplify Studio を使用してバックエンド環境をプロビジョニングしたアプリでは、すべてのプルリクエスト (プライベート Git リポジトリのみ) は一時的なバックエンドを作成し、そのバックエンドは PR がクローズされると削除されます。

アプリのウェブプレビューがオンになっている場合、各 PR はアプリごとに 50 ブランチという Amplify クォータにカウントされます。このクォータを超えないように、必ず PR をクローズします。クォータの詳細については、「Amplify ホスティング Service Quotas」を参照してください。

注記

現在、 AWS_PULL_REQUEST_ID 環境変数は、 をリポジトリプロバイダー AWS CodeCommit として使用する場合は使用できません。

ウェブプレビューのセキュリティ

セキュリティ上の理由から、プライベートリポジトリを持つすべてのアプリでウェブプレビューを有効にできますが、パブリックリポジトリを持つすべてのアプリでは有効にできません。Git リポジトリが公開されている場合、IAM サービスロールを必要としないアプリにのみプレビューを設定できます。例えば、バックエンドを備えたアプリやWEB_COMPUTEホスティングプラットフォームにデプロイされるアプリには IAM サービスロールが必要です。そのため、これらの種類のアプリのリポジトリが公開されている場合、ウェブプレビューを有効にすることはできません。Amplify はこの制限を適用して、アプリのIAMロール権限を使用して実行されるような任意のコードを第三者が送信することを防ぎます。

SSR コンピューティングロールを使用してパブリックリポジトリ内のアプリケーションでウェブプレビューが有効になっている場合は、ロールにアクセスできるブランチを慎重に管理する必要があります。アプリケーションレベルのロールを使用しないことをお勧めします。代わりに、ブランチレベルでコンピューティングロールをアタッチする必要があります。これにより、特定のリソースへのアクセスを必要とするブランチにのみアクセス許可を付与できます。詳細については、「AWS リソースへのアクセスを許可する SSR コンピューティングロールの追加」を参照してください。

プルリクエストのウェブプレビューを有効にする

GitHub リポジトリに保存されているアプリの場合、ウェブプレビューはリポジトリアクセスに Amplify GitHub アプリを使用します。アクセス用に OAuth を使用して GitHub リポジトリからデプロイした既存の Amplify アプリのウェブプレビューを有効にする場合は、まず Amplify GitHub App を使用するようにアプリを移行する必要があります。移行手順については、既存の OAuth アプリを Amplify GitHub アプリに移行するを参照してください。

プルリクエストの Web プレビューを有効にするには

1. [ホスティング] の次に [プレビュー] を選択します。

   注記

   [プレビュー]は、アプリが継続的デプロイ用に設定され、Git リポジトリに接続されている場合にのみ[アプリ設定]メニューに表示されます。この種類のデプロイの手順については、「既存のコードを使い始める」を参照してください。

2. GitHub リポジトリの場合のみ、次の手順を実行して Amplify GitHub App をアカウントにインストールして認可します。

   1. 「GitHub App をインストールしてプレビューを有効にする」ウィンドウで、「GitHub アプリをインストール」を選択します。

   2. Amplify GitHub アプリを設定したい GitHub アカウントを選択します。

   3. GitHub.com で、アカウントのリポジトリ権限を設定するページが開きます。

   4. 次のいずれかを行います：

      • インストールをすべてのリポジトリに適用するには、「全てのリポジトリ」を選択します。

      • 選択した特定のリポジトリのみにインストールを制限するには、[リポジトリのみ選択] を選択します。Web プレビューを有効にするアプリのリポジトリを、選択するリポジトリに必ず含めてください。

   5. [保存] を選択します。

3. リポジトリのプレビューを有効にしたら、Amplify コンソールに戻って特定のブランチのプレビューを有効にします。[プレビュー] ページで、リストからブランチを選択し、[設定を編集] を選択します。

4. [プレビュー設定を管理] ページ、[プルリクエストのプレビュー] をオンにしてください。[Confirm] (確認) を選択します。

5. フルスタックのアプリケーションでは、以下のいずれかを行ってください。

   • [プルリクエストごとに新しいバックエンド環境を作成] を選択します。このオプションを使うと、本番環境に影響を及ぼすことなく変更をテストできます。

   • [このブランチのすべてのプルリクエストを既存の環境に限定する] を選択します。

6. [確認] を選択してください。

次にブランチのプルリクエストを送信すると、Amplify はPRをビルドしてプレビューURLにデプロイします。プルリクエストがクローズされると、プレビュー URL は削除され、プルリクエストにリンクされている一時的なバックエンド環境はすべて削除されます。GitHub リポジトリの場合のみ、GitHub アカウントのプルリクエストから URL のプレビューに直接アクセスできます。

サブドメインによる Web プレビューアクセス

プルリクエストのウェブプレビューには、Amazon Route 53 が管理するカスタムドメインに接続されている Amplify アプリのサブドメインでアクセスできます。プルリクエストがクローズされると、そのプルリクエストに関連するブランチとサブドメインは自動的に削除されます。これは、アプリにパターンベースの機能ブランチのデプロイを設定した後のウェブプレビューのデフォルト動作です。自動サブドメインをセットアップする手順については、「Amazon Route 53 カスタムドメイン用の自動サブドメインの設定」を参照してください。