PLAID Engineer Blog

PLAID Engineer Blog


KARTEを提供する株式会社プレイドのエンジニアブログです。プレイドのエンジニアのユニークなパーソナリティを知ってもらうため、エンジニアメンバーたちが各々執筆しています。

PLAID Engineer Blog

ITP 2.2, 2.3の検証ツールを作ってみた

Naoto KatoNaoto Kato

@otolab です。

ITP 2.2, 2.3に関する調査を行いましたので、検証ツールの解説を行いたいと思います。

今回の検証では、ITP 2.2のリンク装飾(Link Decoration)されたランディングページによるcookieの保存期間短縮と、ITP 2.3で追加されたリファラへのリンク装飾に対する制限について調べています。

2つとも、広告流入時にIDを1st partyとして保存するようなケースを想定しており、流入元から対象サイトへの情報伝達・保存を制限するものです。

なお、localStoageに制限が掛かったことが2.3での変更の大きなポイントですが、制限の元となる条件は2.2のcookieと同様であるのと、localStorageの寿命を簡単に見る方法がないため今回はテストを行っていません。

この記事はITPについての基本的な知識がある前提で書いています。

意外だったこと

  1. リンク装飾に対する制約は2PV目以降にも引き継がれる
  2. trackerドメイン上でのインタラクションによる猶予の影響は受けない
  3. レスポンスヘッダによる遷移はリンク装飾とみなされない(?)

詳細は後述します。

ツール

実験しつつ書きつつだったので、コードやテスト内容は結構場当たり的ですが……。手元では再現性のあるテストを実行できるようになったので、公開します。

また、cookieの寿命(expire)をJavascriptから取得する手段がないので、適宜、Webインスペクタを開いてcookieの有効期限を確認してください。

mochaを使っていますが、上記の理由からタスクランナーとしてのみ使っている状態です。

検証内容

検証に使ったのはSafari 13.0.1と、Safari Technology Preview Release 93です。

テストはコンソール(localhost), SiteA(対象サイト、1stparty.localdomain), SiteB(トラッカードメイン、3rdpartytestwebkit.org)の3つのホストにまたがって実行します。

コンソールはテスト実行の起点になるページで、遷移の関係をシンプルにするために導入しました。このページからのpopupはブロックしないように設定しておいてください。

SiteBはSafariがテスト用に最初からトラッカードメインとして判定しているドメインです。このドメインから対象サイトへの遷移が今回の検証のテーマになります。

3rdpartytestwebkit.org, 1stparty.localdomainは/etc/hostsなどにあらかじめ127.0.0.1として登録しておいてください。ローカルホストの別名として登録された状態になります。

テストは条件を変えてSiteB => SiteAの遷移を繰り返しながら、cookieを設定していきます。

検証手順

  1. 初期設定

    1. SiteA, page1にアクセスして、Cookieを設定(key1, key2)
  2. リンク装飾付き遷移

    1. SiteB, page1にアクセス
      metaタグによってSiteA, page2に装飾付きで遷移
    2. SiteA, page2でCookieを設定(key3, key2)
      手動でリンクをクリックしてSiteA, page3に装飾なしで遷移
    3. SiteA, page3でCookieを設定(key4, key1)
  3. リンク装飾なし、referrer装飾あり遷移

    1. SiteB, page2にアクセス
      metaタグによってSiteB, page3に装飾付きで遷移
    2. SiteB, page3にアクセス
      metaタグによってSiteA, page4に装飾なしで遷移
    3. SiteA, page3でCookieを設定(key5)
  4. リンク装飾あり手動遷移

    1. SiteB, page4にアクセス
      手動でリンクをクリックしてSiteA, page5に装飾付きで遷移
    2. SiteA, page5でCookieを設定(key6)

Cookieはいずれも8日間で設定します。

検証結果

1. 初期設定

1-1でCookie(key1, key2)を保存します。

document.cookieにjavascriptで値を保存しているので、8日間の有効期限を設けても7日間にまで制限されます。これはITP 2.1の効果ですね。

2. リンク装飾付き遷移

リンク装飾されたランディングページによる制限のテスト(2-2)。および2PV目での制限の継続をチェックするテスト(2-3)です。

2-2では新規のkey3の寿命が1 dayまで短くなることが確認できます。また、1-1で設定したkey2を上書きすると同様に寿命が縮むのが確認できます。

ついでにリファラの短縮が起こらないことも確認しています。ここではSiteB, page1にリンク装飾がないため、このリファラ短縮の処理は起きていません。

2-3のテストを見てみましょう。ここで明文化されていない現象が観測できます。SiteA, page3はランディングページではなく、SiteA内で手動でリンクを踏んだ場合の遷移です。にもかかわらず、key4, key1の寿命は1 dayに制限されます。

「意外だったことその1」です。

2PV目以降で再保存することで寿命が伸ばせてしまうと効果がない。ということなのでしょう。

3. リンク装飾なし、referrer装飾あり遷移

ITP 2.3で追加されたリファラの短縮とリンク装飾の関係を調べます。

3-1, 3-2の遷移でSiteB, page3にリンク装飾を付け、そのままSiteA, page4にリンク装飾なしでランディングします。

すると、リファラの短縮が観測できます。また、Cookie(key5)の寿命が縮まないことも確認できました。2つは別のものとして扱われているようです。

また、詳細は不明なのですが、もう一度同じテストを流すとリファラの短縮が発生しないことがあります。毎回cacheを消すとリファラ短縮が安定して発生しするのですが……。バグなのか正しい挙動なのかは不明です。

4. リンク装飾あり手動遷移

トラッカードメイン上でのユーザインタラクションによってCookieの寿命を延長する処理があるので影響を調べましたが、リンクデコレーションの処理とは連携していないようです。

4-1でSiteB上でリンクをクリックした際に、ログを見るとインタラクションを検出したというログは出るようなのですが、4-2でCookieを保存すると1 dayの制限がかかります。

今回はSiteB上でのインタラクションは影響してこないようです。広告のクリックの追跡を想定した制限のようなので、そういうものなのかもしれません。

「意外だったことその2」です。

extra. レスポンスヘッダによるページ遷移

「意外だったことその3」です。

テストツールのindex.jsの16-33行のコメントアウトを外します。そうすると、SiteBでのページ遷移がmetaタグではなく、レスポンスヘッダによるリダイレクトに置き換わります。

この状態でテストすると、じつはリンク装飾によるCookieの寿命短縮が発生しません。テスト方法が悪いのかブラウザのバグなのかはちょっとわからないのですが……。

どうも、現在のページのURLとリファラのURLの比較のみでリンク装飾の制約を掛けているのではないかなと言う印象を持ちました。レスポンスヘッダによる遷移だと、referrerの値がもう一つ前のページになるんですよね。今回のテストケースだとコンソール(localhost)がリファラになります。

まとめと感想

ページ遷移の状態やキャッシュの影響を受けるらしく、挙動がなかなか安定しないため苦労しました……。

さて。

ITP 2.2, 2.3は、ランディングページにクエリ・フラグメントがつくケースすべてを対象としているために、「サイトの作り方」自体を制約して方向づけるような仕様変更であると言えます。たとえば、商品詳細ページに?item=abc123のようにクエリをつけて表現するサイトは、トラッカードメインとみなされたサイト上からのアクセスで、常時cookieやlocalStorageの保存に不安定さを抱えることになります。

今回の変更で不安定化するフェアユースの例としては、ログイン無しでのお気に入り機能などですね。実装方法を変えれば安定化は可能なので、Safariでの動作が必須ならばサイト自体に修正をいれることになるでしょう。

今後も機能の更新が想定されますので、注目していきたいと思います。

参考

いつもの

CX(顧客体験)プラットフォーム「KARTE」を運営するプレイドでは、顧客体験をよりよくするとはどういうことなのか、Webの未来はどう在るべきか、深く考えたいというエンジニア(インターンも)を募集しています。

詳しくは弊社採用ページまたはWantedlyをご覧ください。 もしくはお気軽に、下記の「話を聞きに行きたい」ボタンを押してください。

Naoto Kato
Author

Naoto Kato

Comments