JSSアプリでVercelデプロイメント保護機能を活用してください

Version:
日本語翻訳に関する免責事項

このページの翻訳はAIによって自動的に行われました。可能な限り正確な翻訳を心掛けていますが、原文と異なる表現や解釈が含まれる場合があります。正確で公式な情報については、必ず英語の原文をご参照ください。

デプロイメント保護 は、Vercelクラウドプラットフォームの機能で、開発者や編集者が自分のサイト展開へのアクセスを制限できるようにします。この機能を有効にするには、JSSアプリの設定方法に応じていくつかの変更を加える必要があります。

JSSアプリでデプロイメント保護を使用するには:

  1. アプリのscripts\config\plugins\fallback.tsファイルで、publicUrlの設定方法を変更してください。例えば:

    const publicUrlFallback = (process.env.NODE_ENV !== 'production' ? getPublicUrl() : ''); return Object.assign({}, config, { publicUrl: config.publicUrl || publicUrlFallback, });

    !重要もしDeployment Protection対応のVercel URLのいずれかを編集のレンダリングホストエンドポイントとして使用している場合、Sitecoreの編集ツールが保護バイパス付きのVercelデプロイメントを使えるようにするために、この手順の残りのステップを完了する必要があります。それ以外は、これ以上の変更は必要ありません。

  2. VercelでProtection Bypassトークン を設定してください。

  3. SXAを使うかローカルファイル編集を使ってサイト設定をするかによって、レンダリングホストの設定にバイパストークンを追加してください:

    SXAサイト設定

    1. SXAでは、/sitecore/system/Settings/Services/Rendering Hosts/にあるレンダリングホストの定義を開きます。例えば、定義がvercelの場合、/sitecore/system/Settings/Services/Rendering Hosts/vercelを開きます。

    2. 以下のフィールドのURLにクエリ文字列パラメータx-vercel-protection-bypass=<bypass_token> を追加し、Vercelのバイパストークン値を含めるようにしてください。

      • Server side rendering engine endpoint URL
      • Server side rendering engine application URL
      • Server side rendering engine configuration URL

      以下の例はServer side rendering engine application URLの更新URLを示しています:

      https://<vercel_deployment_url>/?x-vercel-protection-bypass=<bypass_token>

    設定ファイルサイト設定

    アプリの設定ファイルを開き、アプリケーションの ノードでクエリ文字列パラメータx-vercel-protection-bypass=<bypass_token> を以下の属性の値に追加し、Vercelのバイパストークン値も必ず含めてください。

    • serverSideRenderingEngineEndpointUrl
    • serverSideRenderingEngineApplicationUrl

    以下の例はserverSideRenderingEngineApplicationUrlの更新URLを示しています:

    https://<vercel_deployment_url>/?x-vercel-protection-bypass=<bypass_token>

  4. 自動生成URL以外の展開URLでVercel Deployment Protectionが有効で、そのURLをレンダリングホストエンドポイントとして使用している場合、Vercelで以下の手順を行ってください。

    1. 環境変数 PUBLIC_URL 追加します。

    2. 新しい変数の値は、レンダリングホストの設定で使われているプロトコルとホスト名(例: https://<vercel_deployment_url>)に設定してください。

    !重要プレビュー展開では相対パスで十分であることが多いです。相対パスを使用するようにPUBLIC_URL='' 設定できます。これにより、動的Vercel環境におけるクロスドメインアセットリクエストによる潜在的なCORSやCSPの問題を回避できます。

!重要通常モードでプロテクションバイパストークンを使ってサイトにアクセスする場合、すべての静的資産を正しくレンダリングするために、x-vercel-protection-bypassとx-vercel-set-bypass-cookieヘッダーの両方を使うか、クエリ文字列パラメータを使う必要があります。

この記事を改善するための提案がある場合は、 お知らせください!