このページはコミュニティーの尽力で英語から翻訳されました。MDN Web Docs コミュニティーについてもっと知り、仲間になるにはこちらから。

View in English Always switch to English

HTMLScriptElement: attributionSrc プロパティ

非推奨
削除予定

この機能は、ブラウザーから除去される予定です。現時点でこの機能を使用すると、今後の更新で正常に動作しなくなる可能性があります。 Following the announcement that Chrome will maintain its current approach to third-party cookies, Chrome decided to withdraw certain Privacy Sandbox features including the attribution reporting API.

安全なコンテキスト用: この機能は一部またはすべての対応しているブラウザーにおいて、安全なコンテキスト (HTTPS) でのみ利用できます。

非標準: この機能は標準化されていません。非標準の機能はブラウザーの対応が限られ、将来的に変更または削除される可能性があるため、本番環境での使用は推奨されません。ただし、標準の選択肢が存在しない特定のケースでは、有効な代替手段となる場合があります。

attributionSrc は HTMLScriptElement インターフェイスのプロパティで、<script> 要素の attributionsrc 属性をプログラムで取得・設定し、その属性値を反映します。attributionsrc はブラウザーにスクリプトリソースリクエストと一緒に Attribution-Reporting-Eligible ヘッダーを送信することを指定します。

サーバー側では、これはレスポンスで Attribution-Reporting-Register-Source または Attribution-Reporting-Register-Trigger ヘッダーを送信するトリガーとして用いられ、それぞれ JavaScript ベースの帰属ソースまたは帰属トリガーを登録します。どのレスポンスヘッダーを送り返すべきかは、登録を行った Attribution-Reporting-Eligible ヘッダーの値に依存します。

メモ: 他にも、JavaScript の帰属ソースまたはトリガーは、fetch() リクエストに attributionReporting オプションをつけて送信するか(fetch() 呼び出しで直接設定するか、fetch() 呼び出しに渡された Request オブジェクトで)、XMLHttpRequest で setAttributionReporting() をリクエストオブジェクトについて呼び出したりすることもできます。

詳細は属性レポート API です。

値

文字列です。このプロパティには 2 つのバージョンがあり、取得したり設定したりすることができます。

  • 空文字列、すなわち scriptElem.attributionSrc=""。これは、Attribution-Reporting-Eligible ヘッダーを、src 属性がこの点を指すのと同じサーバーに送信することを指定します。これは、帰属ソースやトリガーの登録を同じサーバーで処理している場合には問題ありません。帰属トリガーを登録する場合、このプロパティはオプションであり、除外すると空文字列の値を使用します。

  • 1 つ以上の URL を含む値です。例えば次のようなものです。

    js
    scriptElem.attributionSrc =
      "https://a.example/register-source https://b.example/register-source";
    

    これは、リクエストされたリソースがあなたが制御しているサーバーにない場合や、帰属ソースを別のサーバーに登録する処理だけを行いたい場合に有益です。この場合、attributionSrc の値として 1 つ以上の URL を指定します。リソースリクエストが発生すると、Attribution-Reporting-Eligible ヘッダーがリソースオリジンに加えて、attributionSrc を指定した URL にも送信されます。これらの URL は Attribution-Reporting-Register-Source または Attribution-Reporting-Register-Trigger ヘッダーで応答することができます。

    メモ: 複数の URL を指定するということは、複数の帰属ソースを同じ機能に登録できるということです。例えば、成功を測定しようとしている様々なキャンペーンがあり、異なるデータで異なるレポートを生成する必要があるかもしれません。

例

空の attributionSrc を設定

html
<script src="advertising-script.js"></script>
js
const scriptElem = document.querySelector("script");
scriptElem.attributionSrc = "";

attributionSrc に URL を設定

html
<script src="advertising-script.js"></script>
js
// URL に '=' のような特殊文字が格納されていると不適切に解釈されてしまうため、
// エンコードしてください。
const encodedUrlA = encodeURIComponent("https://a.example/register-source");
const encodedUrlB = encodeURIComponent("https://b.example/register-source");

const scriptElem = document.querySelector("script");
scriptElem.attributionSrc = `${encodedUrlA} ${encodedUrlB}`;

仕様書

この機能は、どの仕様書にも定義されていません。

ブラウザーの互換性

関連情報