• English

サンプルコードと例

このセクションでは、SDK の動作例と、Bright Pattern の組み込み型エージェントデスクトップウィジェットから発信されるすべての Embedded Agent Desktop API メソッドおよびイベントを含む Web ページのサンプルコードをご紹介します。

今すぐお試しください

以下のURLをウェブブラウザのアドレスバーにコピーし、プレースホルダー「corp」をご自身のBright Patternコンタクトセンターインスタンスの名前に置き換えることで、SDKをお試しいただけます：

https://corp.brightpattern.com/agentdesktop/AgentDesktopSdkTest.jsp

コード

このサンプルコードは、SDKおよびそれに組み込まれたAPIでどのようなことができるかを示す例として、あくまで参考情報として提供されているものです。すべてをコピーし、HTML ファイルとして保存して、ウェブブラウザで表示してください。 WebRTC 電話を使用する場合は、frame タグに以下の属性を指定してください：allow="camera *;マイク *"

<!DOCTYPE html>
<HTML lang="en">
<HEAD>
<META charset="UTF-8">
<TITLE>AgentDesktop SDK の例</TITLE><!--これはテスト用の HTML ページです。-->

<SCRIPT type="text/javascript" src="libs/servicepattern-sdk-v1.js"></SCRIPT>//JavaScript での API です。このスクリプトを Web ページに貼り付けてください。
</HEAD>
<BODY>
<IFRAME id="repeater" allow="camera *;マイク *" style="position:absolute; right: 8px; 幅: 30%; 高さ: 90%;"></IFRAME>
//iframeのプロパティを調整することで、エージェントデスクトップウィジェットの外観を変更できます。 Repeater は、エージェントデスクトップウィジェットです。

<BUTTON onclick="bpspat.api.getState(log)">エージェントの状態を取得</BUTTON>
//エージェントの状態を取得します。この例では、Outpage JS API イベントを実行するために、シンプルな HTML ボタンが使用されています。ボタンがイベントを処理します。
<BR>
<BR>
<BUTTON onclick="bpspat.api.setStatus('受付可能')">受付可能状態にする</BUTTON>
//エージェントの状態を「受付可能」に設定します。
<BR>
<BR>
<BUTTON onclick="bpspat.api.logout()">ログアウト</BUTTON>
//エージェントをログアウトさせます。
<BR>
<BR>
<BUTTON onclick="bpspat.api.muteCallRecordings()">通話録音のミュート</BUTTON>
//通話録音をミュートします。
<BUTTON onclick="bpspat.api.unmuteCallRecordings()">通話録音のミュート解除</BUTTON>
//通話録音のミュート解除を行います。
<BUTTON onclick="bpspat.api.muteScreenRecordings()">スクリーン録画のミュート</BUTTON>
//スクリーン録画をミュートします。
<BUTTON onclick="bpspat.api.unmuteScreenRecordings()">スクリーン録画のミュート解除</BUTTON>
//スクリーン録画のミュート解除を行います。
<BR>
<BR>
<INPUT id="service" type="text" placeholder="サービスの名前"/>
<BUTTON onclick="bpspat.api.selectService(document.getElementById('service').value)">サービスの名前を変更</BUTTON>
//コンタクトセンターのサービスの名前を選択します。
<BR>
<BR>
<INPUT id="number" type="text" placeholder="番号の入力"/>
//bpspat.api.dialNumber() イベントのパラメータです。
<BUTTON onclick="bpspat.api.dialNumber(document.getElementById('number').value)">ダイヤル</BUTTON>
//電話番号をダイヤルします。なお、上記の「input id」パラメータの値として電話番号を宣言しておく必要があります。
<BR>
<BR>
<INPUT id="item" type="text" placeholder="インタラクション ID（ログを参照）"/>
//bpspat.api.terminateInteraction() イベントのパラメータです。
<BR>
<BR>
<BUTTON onclick="bpspat.api.terminateInteraction(document.getElementById('item').value)">終了</BUTTON>
//インタラクションを終了します。上記の「input id」パラメータの値として、インタラクションIDを宣言する必要がある点にご注意ください。
<BUTTON onclick="bpspat.api.completeInteraction(document.getElementById('item').value)">完了</BUTTON>
//インタラクションを完了としてマークします。なお、上記の「input id」パラメータの値として、インタラクションID番号を指定する必要があります。
<BR>
<BR>
<BUTTON onclick="bpspat.api.getCallRecordingStatus(document.getElementById('item').値)">通話録音のステータスを取得</BUTTON>
//インタラクションIDを使用して、通話録音のステータスを取得します。 なお、上記の「input id」としてインタラクションID番号を宣言しておく必要があります。
<BUTTON onclick="bpspat.api.startCallRecording(document.getElementById('item').value)">通話録音を開始</BUTTON>
//インタラクションID番号を使用して、通話録音を開始します。 なお、上記の「input id」としてインタラクションID番号を宣言しておく必要があります。
<BUTTON onclick="bpspat.api.stopCallRecording(document.getElementById('item').value)">通話録音の停止</BUTTON>
//インタラクションID番号を使用して通話録音を停止します。なお、上記の「入力ID」としてインタラクションID番号を宣言しておく必要があります。
<BUTTON onclick="bpspat.api.muteCallRecording(document.getElementById('item').value)">通話録音をミュート</BUTTON>
//指定されたインタラクションIDの通話録音の音声をミュートします。
<BUTTON onclick="bpspat.api.unmuteCallRecording(document.getElementById('item').value)">通話録音のミュート解除</BUTTON>
//指定されたインタラクションIDの通話録音のミュート解除を行います。
<BR>
<BR>
<BUTTON onclick="bpspat.api.getScreenRecordingStatus(document.getElementById('item').値)">スクリーン録画のステータスを取得</BUTTON>
//指定されたインタラクションIDのスクリーン録画ステータスを取得します。
<BUTTON onclick="bpspat.api.muteScreenRecording(document.getElementById('item').値)">スクリーン録画をミュート</BUTTON>
//指定されたインタラクションIDのスクリーン録画をミュートします。
<BUTTON onclick="bpspat.api.unmuteScreenRecording(document.getElementById('item').値)">スクリーン録画のミュート解除</BUTTON>
//指定されたインタラクションIDのスクリーン録画のミュートを解除します。
<BUTTON onclick="bpspat.api.stopScreenRecording(document.getElementById('item').値)">スクリーン録画を停止</BUTTON>
//指定されたインタラクション ID のスクリーン録画を停止します。
<BR>
<BR>

<INPUT id="transfer_number" type="text" placeholder="電話番号"/>
//bpspat.api.singleStepTransfer() イベントおよび bpspat.api.singleStepConference() イベントのパラメータです。
<BUTTON onclick="bpspat.api.singleStepTransfer(document.getElementById('transfer_number').value)">ワンステップ転送</BUTTON>
//アクティブなコールを指定された電話番号に転送します。 なお、電話番号は上記の入力フィールドの「transfer_number」パラメータとして指定する必要があります。
<BUTTON onclick="bpspat.api.singleStepConference(document.getElementById('transfer_number').value)">ワンステップ会議</BUTTON>
//指定された電話番号との会議通話を開始します。上記の入力フィールドの「transfer_number」パラメータとして電話番号を指定する必要がある点にご注意ください。
<BR>
<BR>
<INPUT id="dispositionItem" type="text" placeholder="Item_id"/>
//bpspat.api.setDispositionByName() イベントのパラメータです。
<INPUT id="dispositionCode" type="テキスト" placeholder="dispositionコード"/>
//bpspat.api.setDisposition() イベントのパラメータです。

<BUTTON onclick="bpspat.api.setDisposition(document.getElementById('dispositionItem').value, document.getElementById('dispositionCode').value)">コードによるdisposition設定</BUTTON>
//コード（文字列）に基づいてインタラクションのdispositionの処理状態を設定します。

<BUTTON onclick="bpspat.api.setDispositionByName(document.getElementById('dispositionItem').value, document.getElementById('dispositionCode').value)">名前でdispositionの処理状態を設定</BUTTON>
//dispositionの処理結果をdispositionの名前（文字列）で設定します。

<BR>
<BR>
<INPUT id="variableName" type="text" placeholder="変数名"/>
//bpspat.api.postVariable() イベントのパラメータです。
<INPUT id="variableValue" type="text" placeholder="変数値"/>
<BUTTON onclick="bpspat.api.postVariable(document.getElementById('dispositionItem').value, document.getElementById('variableName').value, document.getElementById('variableValue').value)">変数を設定</BUTTON>

<DIV id="log">ログ...</DIV>

<SCRIPT type="text/javascript">
//ページに埋め込まれた AgentDesktop をオリジンとしてスクリプトを初期化します
window.bpspat.api.init(window.location.href.substring(0, window.location.href.indexOf("/agentdesktop/AgentDesktopSdkTest.jsp")));
// サフィックスを消去し、オリジンを渡します

document.getElementById("repeater").src = window.location.href.replace("AgentDesktopSdkTest", "UniversalRepeater");

function log(data) {
let div = document.createElement("div");
div.innerHTML = JSON.stringify(data);
document.getElementById("log").appendChild(div);
}
// イベントハンドラ
window.bpspat.api.addAgentLoginHandler(log);
window.bpspat.api.addStatusChangeHandler(log);
window.bpspat.api.addInteractionRenderedHandler(log);
window.bpspat.api.addInteractionCompletedHandler(log);
window.bpspat.api.addInboundCallOfferedHandler(log);
window.bpspat.api.addInboundCallAnsweredHandler(log);
window.bpspat.api.addOutboundCallDialingHandler(log);
window.bpspat.api.addOutboundCallConnectedHandler(log);
window.bpspat.api.addCallEndedHandler(log);
window.bpspat.api.addCallHeldHandler(log);
window.bpspat.api.addCallResumedHandler(log);
window.bpspat.api.addBlindTransferHandler(log);
window.bpspat.api.addConsultTransferHandler(log);
window.bpspat.api.addCallRecordingStatusHandler(log);
window.bpspat.api.addScreenRecordingStatusHandler(log);
</SCRIPT>
</BODY>
</HTML>

< 前へ