チャットを開始するには、次の手順に従ってください。
ライブチャットによって発生する lcw:ready イベントをリッスンして、 ライブチャットSDKメソッドの使用を開始します。 ライブ チャット メソッドは、 lcw:ready イベントが発生した後に呼び出す必要があります。 このイベントをリッスンするには、ウィンドウオブジェクトに独自のイベントリスナーを追加します。
lcw:ready イベントが発生したら、startChat メソッドを呼び出してチャットを開始します。
チャットの開始時に顧客を認証するには、「 認証トークンの送信」を参照してください。
組織内のさまざまな顧客シナリオに応じてチャットをプロアクティブに開始するには、「 チャットをプロアクティブに開始する」を参照してください。
サンプル コード
window.addEventListener("lcw:ready", function handleLivechatReadyEvent(){
// Handle LiveChat SDK ready event
// SDK methods are ready for use now
// Initiate a chat using startChat SDK
Microsoft.Omnichannel.LiveChatWidget.SDK.startChat();
});
window.addEventListener("lcw:error", function handleLivechatErrorEvent(errorEvent){
// Handle LiveChat error event
console.log(errorEvent);
});
顧客がポータル ページにアクセスしていて、顧客がページ上でしばらく時間を過ごした後にチャットを開始するシナリオを考えてみましょう。 指定した時間が経過した後、プログラムでチャット ウィジェットを開くことができます。
次のサンプル コードは、顧客が 5 分間待機した後にチャットを開始する方法を示しています。
window.addEventListener("lcw:ready", function handleLivechatReadyEvent(){
// Open chat widget proactively after customer has been waiting for 5 minutes
setTimeout(function startProactiveChat() {
Microsoft.Omnichannel.LiveChatWidget.SDK.startChat();
}, 300000);
});
カスタムチャットボタンを使用する
すぐに使用できるチャットボタンの代わりにカスタムチャットボタンを使用するには、ウィジェットスニペットに属性 data-hide-chat-button を追加し、その値を trueに設定します。 カスタム UI コンポーネントのクリック時に startChat メソッドを呼び出して、チャットを開始します。
標準のチャット ボタンを非表示にするサンプル コード スニペット
<script id="Microsoft_Omnichannel_LCWidget" src="<valid-src>" data-app-id="<valid-app-id>" data-org-id="<valid-org-id>" data-org-url="<valid-org-url>" data-hide-chat-button="true"></script>
関連情報
スタートチャット
ライブチャットSDKのJavaScript APIリファレンス
チャットウィジェットのカスタマイズ
事前にチャットを開始する