HTMLAnchorElement: attributionSrc プロパティ

io error: No such file or directory (os error 2) (/home/runner/work/yari/yari/mdn/translated-content/files/ja/web/api/attribution_reporting_api/index.md)

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

Experimental: これは実験的な機能です。
本番で使用する前にブラウザー互換性一覧表をチェックしてください。

attributionSrc は HTMLAnchorElement インターフェイスのプロパティで、<a> 要素の attributionsrc 属性をプログラムから取得および設定ます。attributionsrc は、ブラウザーに Attribution-Reporting-Eligible ヘッダーを送信するように指定します。サーバー側では、レスポンスで Attribution-Reporting-Register-Source ヘッダーを送信し、ナビゲーションベースの帰属元を登録するために使用されます。

ブラウザーは、ナビゲーションレスポンスを受信すると、ナビゲーションベースの帰属ソース（Attribution-Reporting-Register-Source レスポンスヘッダーで指定されたもの）に関連付けられたソースデータを格納します。

詳細は、帰属報告 API を参照してください。

メモ: <a> 要素は帰属のトリガーとして使用することはできず、ソースのみです。

値

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

  • 空文字列、すなわち aElem.attributionSrc="" です。これは、href 属性が指し示すのと同じサーバーに Attribution-Reporting-Eligible ヘッダーが送信されることを指定します。この点は、帰属元の登録を同じサーバーで処理する場合は問題ありません。

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

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

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

    メモ: 複数の URL を指定するということは、同じ機能に複数の帰属ソースを登録できるということになります。例えば、成功を測定しようとしているさまざまなキャンペーンが、異なるデータに関する異なるレポートの生成に関与している場合、異なるキャンペーンを行うことができます。

例

空の attributionSrc の設定

html
<a href="https://shop.example"> Click to visit our shop </a>
js
const aElem = document.querySelector("a");
aElem.attributionSrc = "";

URL を格納するアトリビューション Src を設定するには

html
<a href="https://ourshop.example"> Click to visit our shop </a>
js
// encode the URLs in case they contain special characters
// such as '=' that would be improperly parsed.
const encodedUrlA = encodeURIComponent("https://a.example/register-source");
const encodedUrlB = encodeURIComponent("https://b.example/register-source");

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

仕様書

Specification
Attribution Reporting
# dom-htmlattributionsrcelementutils-attributionsrc

ブラウザーの互換性

BCD tables only load in the browser

関連情報