{"templateId":"markdown","sharedDataIds":{"sidebar":"sidebar-@l10n/ja/sidebars.yaml"},"props":{"metadata":{"markdoc":{"tagList":["admonition","tabs","tab"]},"type":"markdown"},"seo":{"title":"TD Web SDK統合 — In-Browser Messaging","description":"Webサイトにおいて、In-Browser MessagingをRT Personalization 2.0で有効化するためのTD Web SDKのインストール、初期化、設定方法を説明します。","siteUrl":"https://docs.treasure.ai","lang":"en-US","jsonLd":{"@context":"https://schema.org","@graph":[{"@type":"Organization","@id":"https://www.treasure.ai/","name":"Treasure AI","url":"https://www.treasure.ai/","logo":"https://www.treasure.ai/hubfs/assets/images/logos/primary-logo.svg"},{"@type":"WebSite","@id":"https://docs.treasure.ai/#website","name":"Treasure AI Documentation","url":"https://docs.treasure.ai/","inLanguage":["en","ja"],"publisher":{"@id":"https://www.treasure.ai/"}}]},"llmstxt":{"hide":false,"sections":[{"title":"Table of contents","includeFiles":["**/*"],"excludeFiles":[]}],"excludeFiles":[]}},"dynamicMarkdocComponents":[],"compilationErrors":[],"ast":{"$$mdtype":"Tag","name":"article","attributes":{},"children":[{"$$mdtype":"Tag","name":"Heading","attributes":{"level":1,"id":"td-web-sdk統合","__idx":0},"children":["TD Web SDK統合"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["このガイドでは、Webサイトへの",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["TD Web SDK"]},"（",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["td-web-sdk"]},"）のインストール方法とIn-Browser Messaging向けの設定方法を説明します。Engage Studioでキャンペーンを作成する前にこのセットアップを完了してください。"]},{"$$mdtype":"Tag","name":"Admonition","attributes":{"type":"info","name":"このページの対象読者"},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":["このページはWebサイトにSDKを組み込む",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Webデベロッパー"]},"向けです。キャンペーンを作成するマーケターは、セットアップが完了したら",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/ja/products/marketing-cloud/engage-studio/experiences/create-a-popup-campaign"},"children":["Popupキャンペーンの作成"]},"または",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/ja/products/marketing-cloud/engage-studio/experiences/create-an-inline-campaign"},"children":["Inlineキャンペーンの作成"]},"に進んでください。"]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"ステップ-1--sdkのインストール","__idx":1},"children":["ステップ 1 — SDKのインストール"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["プロジェクトに合ったインストール方法を選択してください。"]},{"$$mdtype":"Tag","name":"Tabs","attributes":{"size":"medium"},"children":[{"$$mdtype":"Tag","name":"TabItemFragment","attributes":{"label":"CDN（推奨）","disable":false},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":["すべてのページの",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["<head>"]},"に非同期ローダースニペットを追加します。最も手軽に始められ、あらゆる技術スタックで動作します。"]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"html","header":{"controls":{"copy":{}}},"source":"<head>\n  <!-- TD Web SDK非同期ローダー -->\n  <script type=\"text/javascript\">\n  !function(t,e){if(void 0===e[t]){e[t]=function(){e[t].clients.push(this),this._init=[Array.prototype.slice.call(arguments)]},e[t].clients=[];for(var r=function(t){return function(){return this[\"_\"+t]=this[\"_\"+t]||[],this[\"_\"+t].push(Array.prototype.slice.call(arguments)),this}},s=[\"set\",\"trackEvent\",\"trackPageview\",\"trackClicks\",\"addRecord\",\"setSignedMode\",\"setAnonymousMode\",\"blockEvents\",\"unblockEvents\",\"fetchGlobalID\",\"fetchServerCookie\",\"fetchUserSegments\",\"fetchPersonalization\",\"resetUUID\",\"collectTags\",\"ready\"],c=0;c<s.length;c++){var o=s[c];e[t].prototype[o]=r(o)}var n=document.createElement(\"script\");n.type=\"text/javascript\",n.async=!0,n.src=\"https://cdn.treasuredata.com/sdk/web/1.0/td-sdk.min.js\";var i=document.getElementsByTagName(\"script\")[0];i.parentNode.insertBefore(n,i)}}(\"Treasure\",this);\n  </script>\n</head>\n","lang":"html"},"children":[]},{"$$mdtype":"Tag","name":"Admonition","attributes":{"type":"info","name":"CDNのバージョン管理"},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":["パス ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["/sdk/web/1.0/"]}," はマイナーバージョンに固定されます。パッチリリースはスニペットを更新せずに自動的に反映されます。"]}]}]},{"$$mdtype":"Tag","name":"TabItemFragment","attributes":{"label":"npm","disable":false},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":["モジュールバンドラー（webpack、Vite、Rollupなど）を使用するプロジェクトはnpmでインストールします。"]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"bash","header":{"controls":{"copy":{}}},"source":"npm install td-web-sdk\n","lang":"bash"},"children":[]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"typescript","header":{"controls":{"copy":{}}},"source":"// TypeScript / ESモジュール\nimport Treasure from 'td-web-sdk'\n\n// CommonJS\nconst Treasure = require('td-web-sdk').default\n","lang":"typescript"},"children":[]}]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"ステップ-2--sdkの初期化","__idx":2},"children":["ステップ 2 — SDKの初期化"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["Treasure"]},"インスタンスを1つ作成し、参照を保持してください。",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["trackEvent"]},"の呼び出しより前に、できるだけ早く初期化してください。"]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"javascript","header":{"controls":{"copy":{}}},"source":"const td = new Treasure({\n  writeKey: 'YOUR_WRITE_KEY',   // TDアカウントの書き込み専用APIキー\n  database: 'YOUR_DATABASE',    // ターゲットデータベース名\n  host: 'YOUR_REGION_HOST',     // 下記のリージョン別ホストを参照\n})\n","lang":"javascript"},"children":[]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"in-browser-messagingパーソナライズの有効化","__idx":3},"children":["In-Browser Messaging（パーソナライズ）の有効化"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Engage Studioからポップアップまたはインラインメッセージを受け取るには、",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["personalization"]},"オプションを追加します。設定すると、",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["trackEvent"]},"の呼び出しが標準のインジェストエンドポイントではなく",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["RT Personalization API"]},"経由にルーティングされ、SDKがキャンペーンペイロードを取得してメッセージを自動的にレンダリングします。"]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"javascript","header":{"controls":{"copy":{}}},"source":"const td = new Treasure({\n  writeKey: 'YOUR_WRITE_KEY',\n  database: 'YOUR_DATABASE',\n  host: 'YOUR_REGION_HOST',\n  personalization: {\n    endpoint: 'YOUR_P13N_ENDPOINT',  // リージョン依存。CSMに確認してください。\n    token: 'YOUR_WP13N_TOKEN',       // Audience StudioのWP13n-Token\n  },\n})\n","lang":"javascript"},"children":[]},{"$$mdtype":"Tag","name":"Admonition","attributes":{"type":"warning","name":"パーソナライズはインジェストを置き換えます"},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["personalization"]},"を設定すると、",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["イベントはTDデータベースに書き込まれず"]},"、RT Personalization APIに送信されます。インジェストとパーソナライズの両方が必要な場合は、デュアルパスパターンについてカスタマーサクセスマネージャーにご相談ください。"]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"設定リファレンス","__idx":4},"children":["設定リファレンス"]},{"$$mdtype":"Tag","name":"div","attributes":{"className":"md-table-wrapper"},"children":[{"$$mdtype":"Tag","name":"table","attributes":{"className":"md"},"children":[{"$$mdtype":"Tag","name":"thead","attributes":{},"children":[{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"th","attributes":{"width":"25%","data-label":"オプション"},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["オプション"]}," "]},{"$$mdtype":"Tag","name":"th","attributes":{"width":"10%","data-label":"必須"},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["必須"]}," "]},{"$$mdtype":"Tag","name":"th","attributes":{"width":"65%","data-label":"説明"},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["説明"]}," "]}]}]},{"$$mdtype":"Tag","name":"tbody","attributes":{},"children":[{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["writeKey"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["✅"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["書き込み専用APIキー。TDアカウント設定で確認できます。"]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["database"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["✅"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["イベントを保存するターゲットデータベース名。"]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["host"]}]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":["—"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":["データインジェストエンドポイント。リージョンに応じて以下の値を指定してください。"]},{"$$mdtype":"Tag","name":"div","attributes":{"className":"md-table-wrapper"},"children":[{"$$mdtype":"Tag","name":"table","attributes":{"className":"md"},"children":[{"$$mdtype":"Tag","name":"thead","attributes":{},"children":[{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"th","attributes":{"data-label":"リージョン"},"children":["リージョン"]},{"$$mdtype":"Tag","name":"th","attributes":{"data-label":"ホスト"},"children":["ホスト"]}]}]},{"$$mdtype":"Tag","name":"tbody","attributes":{},"children":[{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":["US"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["us01.records.in.treasuredata.com"]}]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Tokyo"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["ap01.records.in.treasuredata.com"]}]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":["AP02"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["ap02.records.in.treasuredata.com"]}]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":["EU01"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["eu01.records.in.treasuredata.com"]}]}]}]}]}]}]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["personalization.endpoint"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["✅（In-Browser Messagingを使用する場合）"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["RT Personalization APIエンドポイント。リージョン依存。"]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["personalization.token"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["✅（In-Browser Messagingを使用する場合）"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Audience StudioのPersonalization設定にあるWP13n-Token。"]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["startInSignedMode"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["—"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["true"]}," に設定すると、最初のイベントからPII（クライアントID、IPアドレス）を収集します。デフォルト: ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["false"]},"（匿名モード）。"]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["logging"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["—"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["デバッグ用のSDKコンソールログを有効化します。デフォルト: 開発環境では ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["true"]},"。"]}]}]}]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"ステップ-3--ページビューの計測","__idx":5},"children":["ステップ 3 — ページビューの計測"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["すべてのページロードまたはSPAのルート変更で、",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["event_name: 'page_view'"]}," を指定して ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["trackEvent"]}," を呼び出します。RT PersonalizationがEntry Criteriaを評価してメッセージを配信するために必要です。"]},{"$$mdtype":"Tag","name":"Tabs","attributes":{"size":"medium"},"children":[{"$$mdtype":"Tag","name":"TabItemFragment","attributes":{"label":"Static HTML / MPA","disable":false},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":["すべてのページロードで ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["trackEvent"]}," を呼び出します。ナビゲーションのたびにページが再読み込みされるため、1ページにつき1回の呼び出しで十分です。"]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"html","header":{"controls":{"copy":{}}},"source":"<script>\n  // SDK初期化後\n  td.trackEvent('events', { event_name: 'page_view' })\n</script>\n","lang":"html"},"children":[]}]},{"$$mdtype":"Tag","name":"TabItemFragment","attributes":{"label":"React SPA","disable":false},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":["クライアントサイドのルート変更では、ルートを監視する ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["useEffect"]}," 内で ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["trackEvent"]}," を呼び出します。ただし、",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["最初のレンダーはスキップ"]},"して初回ロード時の二重カウントを防いでください。"]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"jsx","header":{"controls":{"copy":{}}},"source":"// components/Layout.jsx\nimport { useEffect, useRef } from 'react'\nimport { useLocation } from 'react-router-dom'\n\nexport default function Layout({ children }) {\n  const location = useLocation()\n  const firstRender = useRef(true)\n\n  useEffect(() => {\n    if (firstRender.current) {\n      firstRender.current = false\n      return // スキップ: 初回はロード時に計測済み\n    }\n    window.td?.trackEvent('events', { event_name: 'page_view' })\n  }, [location.pathname, location.search])\n\n  return <>{children}</>\n}\n","lang":"jsx"},"children":[]}]},{"$$mdtype":"Tag","name":"TabItemFragment","attributes":{"label":"Next.js (App Router)","disable":false},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["usePathname"]}," と ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["useSearchParams"]}," を監視する ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["PageviewTracker"]}," クライアントコンポーネントを追加します。静的エクスポートでは ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["<Suspense>"]}," でラップが必要です。"]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"jsx","header":{"controls":{"copy":{}}},"source":"// components/PageviewTracker.jsx\n'use client'\nimport { useEffect, useRef } from 'react'\nimport { usePathname, useSearchParams } from 'next/navigation'\n\nexport default function PageviewTracker() {\n  const pathname = usePathname()\n  const searchParams = useSearchParams()\n  const firstRender = useRef(true)\n\n  useEffect(() => {\n    if (firstRender.current) {\n      firstRender.current = false\n      return // スキップ: 初回はロード時に計測済み\n    }\n    window.td?.trackEvent('events', { event_name: 'page_view' })\n  }, [pathname, searchParams])\n\n  return null\n}\n\n// app/layout.jsx\nimport { Suspense } from 'react'\nimport PageviewTracker from '@/components/PageviewTracker'\n\nexport default function RootLayout({ children }) {\n  return (\n    <html>\n      <body>\n        <Suspense fallback={null}>\n          <PageviewTracker />\n        </Suspense>\n        {children}\n      </body>\n    </html>\n  )\n}\n","lang":"jsx"},"children":[]}]},{"$$mdtype":"Tag","name":"TabItemFragment","attributes":{"label":"GTM","disable":false},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Google Tag Managerで、",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["All Pages"]},"と",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["History Change"]},"（SPA向け）で発火する",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Custom HTML"]},"タグを作成します。"]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"html","header":{"controls":{"copy":{}}},"source":"<!-- GTM Custom HTMLタグ -->\n<script>\n  if (window.td) {\n    window.td.trackEvent('events', { event_name: 'page_view' })\n  }\n</script>\n","lang":"html"},"children":[]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["MPAサイトでは",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["All Pages"]},"トリガーを設定し、シングルページアプリケーションには",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["History Change"]},"トリガーを追加してください。"]}]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"ステップ-4--ユーザーidの設定","__idx":6},"children":["ステップ 4 — ユーザーIDの設定"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["SDKには匿名IDの管理メカニズムが2つあります。",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["サーバーサイドCookie（",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["td_ssc_id"]},"）の使用を推奨します"]},"。お客様自身のサーバーから発行され、JavaScriptが設定するファーストパーティCookieを7日間に制限するブラウザのITP制限を受けないためです。"]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"オプション-a--サーバーサイドcookie推奨","__idx":7},"children":["オプション A — サーバーサイドCookie（推奨）"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["td_ssc_id"]}," はブラウザではなくお客様のサーバーが設定するCookieです。Safari ITPやiOS環境でも確実に持続し、In-Browser Messagingにおける推奨識別子です。"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["事前のインフラ設定が必要です"]},": お客様のドメイン上に小さなSSCサーバーエンドポイントをデプロイする必要があります（例: ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["ssc.yourdomain.com"]},"）。SSCサーバーのセットアップガイドについてはカスタマーサクセスマネージャーまたは実装チームにお問い合わせください。"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["SSCインフラが整ったら："]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"javascript","header":{"controls":{"copy":{}}},"source":"const td = new Treasure({\n  writeKey: 'YOUR_WRITE_KEY',\n  database: 'YOUR_DATABASE',\n  host: 'YOUR_REGION_HOST',\n  useServerSideCookie: true,\n  sscDomain: 'yourdomain.com',   // ルートドメイン\n  personalization: {\n    endpoint: 'YOUR_P13N_ENDPOINT',\n    token: 'YOUR_WP13N_TOKEN',\n  },\n})\n\n// Signedモードを有効化してからサーバーサイドCookieを取得\ntd.setSignedMode()\ntd.fetchServerCookie(\n  (sscId) => console.log('SSC ID:', sscId),\n  (error) => console.error('SSC fetch failed:', error)\n)\n","lang":"javascript"},"children":[]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["fetchServerCookie"]}," が成功すると、",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["td_ssc_id"]}," がその後のすべてのイベントに自動的に含まれます。"]},{"$$mdtype":"Tag","name":"Admonition","attributes":{"type":"info","name":"SSCの前提条件"},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["fetchServerCookie"]}," には以下が必要です。"]},{"$$mdtype":"Tag","name":"ol","attributes":{},"children":[{"$$mdtype":"Tag","name":"li","attributes":{},"children":["SDKの設定で ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["useServerSideCookie: true"]}]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["fetchServerCookie()"]}," の前に ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["setSignedMode()"]}," を呼び出すこと"]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":["お客様のドメインにSSCサーバーエンドポイントがデプロイ済みでアクセス可能であること"]}]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"オプション-b--ファーストパーティブラウザcookieフォールバック","__idx":8},"children":["オプション B — ファーストパーティブラウザCookie（フォールバック）"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["SSCインフラがまだ用意できない場合、SDKは ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["td_client_id"]},"（ブラウザが設定するファーストパーティCookie）にフォールバックします。サーバーインフラなしで動作しますが、ITP制限（Safari/iOSでは7日間の上限）の影響を受けます。"]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"javascript","header":{"controls":{"copy":{}}},"source":"// 追加設定不要 — td_client_idは自動管理される\nconst td = new Treasure({\n  writeKey: 'YOUR_WRITE_KEY',\n  database: 'YOUR_DATABASE',\n  host: 'YOUR_REGION_HOST',\n  personalization: {\n    endpoint: 'YOUR_P13N_ENDPOINT',\n    token: 'YOUR_WP13N_TOKEN',\n  },\n})\n","lang":"javascript"},"children":[]},{"$$mdtype":"Tag","name":"div","attributes":{"className":"md-table-wrapper"},"children":[{"$$mdtype":"Tag","name":"table","attributes":{"className":"md"},"children":[{"$$mdtype":"Tag","name":"thead","attributes":{},"children":[{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"th","attributes":{"width":"20%","data-label":"識別子"},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["識別子"]}," "]},{"$$mdtype":"Tag","name":"th","attributes":{"width":"15%","data-label":"設定者"},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["設定者"]}," "]},{"$$mdtype":"Tag","name":"th","attributes":{"width":"20%","data-label":"ITP / Safari"},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["ITP / Safari"]}," "]},{"$$mdtype":"Tag","name":"th","attributes":{"width":"20%","data-label":"インフラ"},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["インフラ"]}," "]},{"$$mdtype":"Tag","name":"th","attributes":{"width":"25%","data-label":"推奨度"},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["推奨度"]}," "]}]}]},{"$$mdtype":"Tag","name":"tbody","attributes":{},"children":[{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["td_ssc_id"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["お客様のサーバー"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["✅ 影響なし"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["SSCサーバーが必要"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["推奨"]}]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["td_client_id"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["ブラウザ（JS）"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["⚠️ 7日間の上限"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["不要"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["フォールバックのみ"]}]}]}]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"認証済みユーザーidの設定","__idx":9},"children":["認証済みユーザーIDの設定"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["ユーザーがログインした後は、どのCookieを使用していても、デバイスやチャネルをまたいでイベントを紐付けるために内部ユーザーIDを設定してください。"]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"javascript","header":{"controls":{"copy":{}}},"source":"// ログイン後 / セッション復元後\ntd.set('$global', 'td_user_id', 'YOUR_INTERNAL_USER_ID')\n\n// この時点以降、すべてのイベントにtd_user_idが含まれます\ntd.trackEvent('events', { event_name: 'page_view' })\n","lang":"javascript"},"children":[]},{"$$mdtype":"Tag","name":"Admonition","attributes":{"type":"info","name":"ID設計について"},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":["メールアドレスや電話番号ではなく、",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["安定した非PII内部ID"]},"（アカウントID、CRM IDなど）を使用してください。ユーザーが認証済みの場合のみ ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["td_user_id"]}," を設定してください。"]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"匿名モードとsignedモード","__idx":10},"children":["匿名モードとSignedモード"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["デフォルトではSDKは",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["匿名モード"]},"で動作し、識別子とIPアドレスは送信されません。ユーザーがトラッキングに同意した場合にSignedモードを有効化してください。"]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"data-language":"javascript","header":{"controls":{"copy":{}}},"source":"// ユーザーが同意 — PII収集を有効化（SSCには必須）\ntd.setSignedMode()\n\n// ユーザーが同意を撤回\ntd.setAnonymousMode()\n\n// すべてのイベントをブロック（例: Cookieバナーで拒否）\ntd.blockEvents()\ntd.unblockEvents() // 再開\n","lang":"javascript"},"children":[]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"ステップ-5--セットアップの確認","__idx":11},"children":["ステップ 5 — セットアップの確認"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["ブラウザのDevToolsを開き → ",{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Network"]},"タブで",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["host"]},"または",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["personalization.endpoint"]},"ドメインへのリクエストをフィルタリングします。",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["trackEvent"]},"を呼び出した後、以下が確認できるはずです。"]},{"$$mdtype":"Tag","name":"ul","attributes":{},"children":[{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["パーソナライズなし"]},": インジェストエンドポイントへのPOSTリクエスト（イベントペイロード付き）。"]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["パーソナライズあり"]},": p13nエンドポイントへのPOSTリクエスト。レスポンスの",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["offers"]},"オブジェクトにアクティブなキャンペーンペイロードが含まれます。"]}]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Console"]},"タブでも確認できます。SDKはリクエストURLとペイロードを ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["[td-debug]"]}," メッセージとして出力します。"]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"ユーザーidとプライバシー","__idx":12},"children":["ユーザーIDとプライバシー"]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"匿名から認証済みへの遷移","__idx":13},"children":["匿名から認証済みへの遷移"]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"header":{"controls":{"copy":{}}},"source":"ユーザーが訪問（ログインなし）\n  └─ td_ssc_idがサーバーから発行される（推奨）\n     または td_client_idがブラウザによって設定される（フォールバック）\n  └─ イベントは匿名で送信される\n\nユーザーがログイン\n  └─ td.set('$global', 'td_user_id', 'user_12345')\n  └─ 以降のイベントにCookie IDとtd_user_idの両方が含まれる\n  └─ RT 2.0のIDスティッチングが匿名履歴とユーザーを紐付ける\n"},"children":[]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"自動収集されるプロパティ","__idx":14},"children":["自動収集されるプロパティ"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["SDKはすべてのイベントに以下のフィールドを自動的に付加します。実装は不要です。"]},{"$$mdtype":"Tag","name":"div","attributes":{"className":"md-table-wrapper"},"children":[{"$$mdtype":"Tag","name":"table","attributes":{"className":"md"},"children":[{"$$mdtype":"Tag","name":"thead","attributes":{},"children":[{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"th","attributes":{"width":"25%","data-label":"プロパティ"},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["プロパティ"]}," "]},{"$$mdtype":"Tag","name":"th","attributes":{"width":"50%","data-label":"説明"},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["説明"]}," "]},{"$$mdtype":"Tag","name":"th","attributes":{"width":"25%","data-label":"PII?"},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["PII?"]}," "]}]}]},{"$$mdtype":"Tag","name":"tbody","attributes":{},"children":[{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["td_ssc_id"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["サーバーサイドCookieの識別子（推奨 — ITP制限なし）"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["あり（Signedモードのみ）"]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["td_client_id"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["ファーストパーティブラウザCookieの識別子（フォールバック — SafariでITP 7日間の上限あり）"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["あり（Signedモードのみ）"]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["td_session_id"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["セッションごとのUUID（将来のSDKバージョン）"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["なし"]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["td_url"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["現在のページURL"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["場合による"]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["td_path"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["URLパス（例: ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["/product/123"]},"）"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["なし"]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["td_host"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["ホスト名"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["なし"]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["td_referrer"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["参照元URL"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["場合による"]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["td_title"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["ページタイトル"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["なし"]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["td_viewport"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["ブラウザウィンドウサイズ（",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["幅x高さ"]},"）"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["なし"]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["td_screen"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["画面解像度（",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["幅x高さ"]},"）"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["なし"]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["td_language"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["ブラウザの言語設定"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["なし"]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["td_user_agent"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["ブラウザのUser-Agent文字列"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["場合による"]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["td_version"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["SDKバージョン"]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["なし"]}]}]}]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"次のステップ","__idx":15},"children":["次のステップ"]},{"$$mdtype":"Tag","name":"ul","attributes":{},"children":[{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/ja/products/marketing-cloud/engage-studio/experiences/event-tracking"},"children":["イベントトラッキング"]}," — ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["view_item"]},"、",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["add_to_cart"]},"、",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["purchase"]},"などのビジネスイベントを定義する"]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/ja/products/marketing-cloud/engage-studio/experiences/create-a-popup-campaign"},"children":["Popupキャンペーンの作成"]}]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":[{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/ja/products/marketing-cloud/engage-studio/experiences/create-an-inline-campaign"},"children":["Inlineキャンペーンの作成"]}]}]}]},"headings":[{"value":"TD Web SDK統合","id":"td-web-sdk統合","depth":1},{"value":"ステップ 1 — SDKのインストール","id":"ステップ-1--sdkのインストール","depth":2},{"value":"ステップ 2 — SDKの初期化","id":"ステップ-2--sdkの初期化","depth":2},{"value":"In-Browser Messaging（パーソナライズ）の有効化","id":"in-browser-messagingパーソナライズの有効化","depth":3},{"value":"設定リファレンス","id":"設定リファレンス","depth":3},{"value":"ステップ 3 — ページビューの計測","id":"ステップ-3--ページビューの計測","depth":2},{"value":"ステップ 4 — ユーザーIDの設定","id":"ステップ-4--ユーザーidの設定","depth":2},{"value":"オプション A — サーバーサイドCookie（推奨）","id":"オプション-a--サーバーサイドcookie推奨","depth":3},{"value":"オプション B — ファーストパーティブラウザCookie（フォールバック）","id":"オプション-b--ファーストパーティブラウザcookieフォールバック","depth":3},{"value":"認証済みユーザーIDの設定","id":"認証済みユーザーidの設定","depth":3},{"value":"匿名モードとSignedモード","id":"匿名モードとsignedモード","depth":3},{"value":"ステップ 5 — セットアップの確認","id":"ステップ-5--セットアップの確認","depth":2},{"value":"ユーザーIDとプライバシー","id":"ユーザーidとプライバシー","depth":2},{"value":"匿名から認証済みへの遷移","id":"匿名から認証済みへの遷移","depth":3},{"value":"自動収集されるプロパティ","id":"自動収集されるプロパティ","depth":3},{"value":"次のステップ","id":"次のステップ","depth":2}],"frontmatter":{"seo":{"title":"TD Web SDK統合 — In-Browser Messaging","description":"Webサイトにおいて、In-Browser MessagingをRT Personalization 2.0で有効化するためのTD Web SDKのインストール、初期化、設定方法を説明します。"}},"lastModified":"2026-06-18T03:34:22.000Z","pagePropGetterError":{"message":"","name":""}},"slug":"/ja/products/marketing-cloud/engage-studio/experiences/sdk-integration","userData":{"isAuthenticated":false,"teams":["anonymous"]},"isPublic":true}