アプリがほとんどページリフレッシュを行わず（つまり、クライアント側でコンテンツが切り替わるがページリフレッシュは発生しない）、多数の非同期JSがある場合は、顧客のデータを最新に保ち、すべてのアウトバウンドコンテンツ（メッセージ、ツアーなど）を受け取れるように、Intercomを少し異なる方法で統合する必要があります。
以下を推奨します:
まず、HTMLのhead要素にintercom JSライブラリファイルを含めてください。
(function(){var w=window;var ic=w.Intercom;if(typeof ic==="function"){ic('reattach_activator');ic('update',w.intercomSettings);}else{var d=document;var i=function(){i.c(arguments);};i.q=[];i.c=function(args){i.q.push(args);};w.Intercom=i;var l=function(){var s=d.createElement('script');s.type='text/javascript';s.async=true;s.src='https://widget.intercom.io/widget/' + APP_ID;var x=d.getElementsByTagName('script')[0];x.parentNode.insertBefore(s,x);};if(w.attachEvent){w.attachEvent('onload',l);}else{w.addEventListener('load',l,false);}}})();
重要：上記のコードスニペットをコピーした場合は、必ずworkspace ID（コード内ではAPP_IDと呼ばれます）を手動で変更してください。
次に、サイトにログインしたusersがいる場合（認証後にその詳細が利用可能になった後）、window.Intercom('boot', {user_data})を呼び出します。ここでuser_dataはusersに関するすべてのデータです。usersを更新するために、毎回user_idおよび/またはemailを送信してください。これにより、ログインしたusersの詳細がIntercomに送信され、新しいメッセージが表示されるかどうかがチェックされます。
ログアウトした訪問者の例は次のとおりです:
window.Intercom('boot', {
app_id: 'abc12345',
custom_launcher_selector: '#my_custom_link'
});
重要：上記のコードスニペットをコピーした場合は、必ずworkspace ID（コード内ではAPP_IDと呼ばれます）を手動で変更してください。
次に、usersをログインさせるかusersに変換したい場合は、bootメソッドを変更してusers情報を含めます:
window.Intercom('boot', {
app_id: 'abc12345',
email: 'example@example.com',
user_id: 'abc123',
created_at: 1234567890,
custom_launcher_selector: '#my_custom_link'
});重要：上記のコードスニペットをコピーした場合は、必ずworkspace ID（コード内ではAPP_IDと呼ばれます）を手動で変更してください。
Google Tag ManagerでIntercomをインストールする
JavaScriptフレームワークでIntercomを使用する
シングルページアプリはEmber.js、React、Vue、Angular、Next.jsなどのJavaScriptフレームワークで構築されることが多いです。これらすべてに対しては、このドキュメントで説明されているSPA統合パターンを使用してください。つまり、ルートに入るとMessengerを起動し、ログアウト時にシャットダウンします。標準のコードスニペットは、ページがナビゲーション時に完全にリロードされないため、信頼性がありません。 フレームワーク固有のnpmパッケージについては、設定 → チャンネル → Messenger → インストール → Web用インストールに進み、リストからフレームワークを選択してください。
データやURLが変更されたときにIntercomに通知する
アプリで使用する可能性のある2つの追加呼び出しがあります。
usersのデータが変更された場合、またはページ読み込みなしでURLを何らかの方法で変更した場合は、window.Intercom('update', {user_data})を呼び出してください。ここでuser_dataはusersデータの変更セットです。
重要：update呼び出しはページリフレッシュをシミュレートし、Intercomが顧客に送信すべき新しいメッセージやツアーをチェックします。
変更された部分のみを含めればよく、すべてのusersデータを毎回含める必要はありません。ただし、user_idおよび/またはemailは必ず送信してください。
update関数の使用例は次のとおりです（app_idを必ず変更してください）：
usersを通常通り起動します：
window.Intercom('boot', {app_id: APP_ID, email: 'someuser@example.com', apples: 1});usersのデータが変更された場合、または「ページ」変更が発生した場合は、次のように呼び出します：
window.Intercom('update', {email: 'someuser@example.com', apples: 2});新しいusersデータと共に。
重要：URLが変更されるたびに「ping」を開始するには、新しいusersデータを含むIntercom("update")を呼び出す必要があります。usersデータが変更されていない場合は、次のように現在時刻を'last_request_at'の値として送信できます。
Intercom("update", {last_request_at: parseInt((new Date()).getTime()/1000)})
URLが完全にページリロードされずに変更された場合、Intercom MessengerはURLの変更を自動的にIntercomに送信せず、URLに基づくメッセージの一致が行われません。
update呼び出しは、1ユーザーあたり1ページで20回までに制限されており、これを超えると制限がかかります。制限は30分ごとにリセットされ、ページのリフレッシュやリロードでリセットされます。
このため、Auto Messageをトリガーする可能性のあるusersデータの変更がIntercomに送信される場所でのみ更新することを推奨します。
セッションを終了する方法
Intercomは、所有する任意の公開サイト（マーケティングサイト、ドキュメントサイト、開発者ハブなど）にIntercom Messengerを設置できます。usersがログインしている間、これらの異なるサブドメイン間で会話の連続性を維持するために、usersのブラウザにクッキーを設定します。このクッキーは1週間で期限切れになります。
共有コンピューターやブラウザーを他の人と使うusersは、クッキーが期限切れになるまで、直近にログインしたusersの会話履歴を見ることができます。このため、usersのセッションが終了したとき（手動または自動ログアウト時）にIntercomを適切にシャットダウンすることが非常に重要です。
Intercomのシャットダウン方法：
すでにIntercom JSスニペットまたは「boot」メソッドでusersの追跡を開始しているはずです。
usersがIntercomからログアウトしたとき（またはアプリによって自動的にログアウトされたとき）、JavaScript APIから
Intercom('shutdown');を呼び出して、Intercomセッションを終了しクッキーをクリアしてください。必要に応じて、新しいセッションを開始するために
Intercom('boot', {app_id: 'YOUR_APP_ID'})を呼び出してください。
重要：コード内のapp_idを必ず自分のworkspace IDに変更してください。
Intercom('shutdown');メソッドは、別のusersのログインやログアウトエリアでのIntercom起動のために、Intercomを自動的にクリーンな状態にリセットします。
シングルページアプリでの本人確認の有効化
シングルページアプリで本人確認を有効にするには、boot呼び出しにuser_hash属性を追加してください。
アプリケーションでusers識別を実装する際は、以下の重要なガイドラインに従ってください:
usersが認証されてログインした後にのみ、Intercomにusersを識別してください。
ログインしていないusers（訪問者）には、設定にapp_idのみを含めてください。
users情報をハードコードせず、認証後に動的に設定してください。
詳細はこちらをご覧ください。
注意：Messenger Securityがない場合、usersはMessengerで過去14日間の会話履歴のみを閲覧できます。詳細はこちら →