JSS Next.jsアプリでSitecoreの追跡と分析を有効にする

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

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

JSSは、RESTフェッチ メソッドを使用してサーバー側でレンダリングされたアプリケーションに対してのみ、Sitecoreの追跡と分析をサポートします。このタイプのトラッキングは、both Static Site Generation (SSG) and Server-side Rendering (SSR)で可能なJSS Tracking APIを使用したトラッキングとは異なりclient-side tracking

メモ

現在、Sitecore GraphQL Edgeスキーマで追跡と分析を使用することはできません。

JSS Next.jsアプリでSitecoreの追跡と分析を有効にするには、アプリケーションで以下を使用する必要があります。

このチュートリアルでは、Next.jsアプリケーションでSitecoreの完全な追跡と分析を有効にするために必要な手順について説明します。

このチュートリアルでは、次の方法について説明します。

  • JSS Next.jsアプリケーションでのレイアウト・サービス・リクエストのトラッキングを有効にします。

  • Sitecoreの設定を更新します。

JSS Next.jsアプリケーションでのレイアウト・サービス要求のトラッキングの有効化

Sitecoreの追跡と分析を有効にするには、Next.js JSSアプリケーションでLayout Serviceリクエストの追跡を有効にし、サーバー側のレンダリングを使用し、追跡用の正しいヘッダーを渡す必要があります。

Sitecoreの追跡と分析を有効にするには:

  1. アプリケーションで現在静的生成を使用している場合は、サーバー側レンダリングに切り替えます。

  2. Sitecore 10.0.1以降、SitecoreはデフォルトですべてのCookieにSecureフラグを設定します。ローカル環境でHTTPSを有効にします。

  3. アプリケーションで現在Sitecore GraphQL Edgeスキーマを使用している場合は、Sitecoreレイアウト サービスREST APIに切り替えます。切り替え後、アプリケーションはサービスRestLayoutServiceを使用し、デフォルトで追跡を有効にし、必要なヘッダーをリクエストと共に渡します。

    トラッキングを明示的に有効にする場合は、Next.js JSSアプリのルートディレクトリのファイルsrc/lib/layout-service-factory.tsで、trackingパラメーターを定義します。

    return new RestLayoutService({
      ...
      tracking: true, // <-- enables tracking!
    });
先端

ターゲットの地理的な理由の法的要件に応じて、訪問者の同意に基づいてWebトラッキングを有効または無効にすることができます。

Sitecoreの設定を更新する

JSSアプリで追跡と分析が有効になっている場合は、転送ヘッダーを読み取るようにSitecoreに指示し、開発中はロボット検出を無効にする必要があります。

転送された要求ヘッダーを指定します

Next.js SSRルートを使用する場合、Layout ServiceリクエストはX-Forwarded-Forヘッダーでクライアントの元のIPアドレスを送信します。

Sitecoreにヘッダーを読み取るように指示し、設定の値を設定することで、分析が正しい元のクライアントIPアドレスを追跡するようにする必要がありますAnalytics.ForwardedRequestHttpHeader

SitecoreでAnalytics.ForwardedRequestHttpHeaderを設定するには:

  • Next.js JSSアプリのルートディレクトリにあるsitecore/<AppName>.configファイルで、settingsノードで、次のコメントを解除または追加します。

    <setting name="Analytics.ForwardedRequestHttpHeader" set:value="X-Forwarded-For" />

開発中のロボット追跡の有効化

開発中、Sitecore Analyticsは ロボット検出を有効にするため、分析アクティビティはロボット アクティビティとしてフラグが付けられ、追跡されません。ロボットのアクティビティを追跡してアプリをテストするには、ロボットの検出を無効にします。

大事な

この変更は、本番環境ではなく、開発only行う必要があります。

開発中にロボットの追跡を有効にするには:

  • Next.js JSSアプリのルート ディレクトリでsitecore/{:placeholder-token:}<APP_NAME>{/:placeholder-token:}.configファイルを開き、settingsノードで以下を追加するか、既に存在する場合はコメントを解除します。

    <setting name="Analytics.AutoDetectBots" set:value="false" />
    <setting name="Analytics.Robots.IgnoreRobots" set:value="false" />
この記事を改善するための提案がある場合は、 お知らせください!