amazon connect streams
2.16.0
Amazon Connect Streams API (Streams) 可讓您將現有 Web 應用程式與 Amazon Connect 整合。 Streams 可讓您將聯絡人控制面板 (CCP) 和客戶檔案應用程式 UI 嵌入到您的頁面中。它還使您能夠透過物件導向的事件驅動介面直接處理座席和聯絡人狀態事件。您可以使用內建介面或從頭開始建立自己的介面：Streams 為您提供了選擇。
該函式庫必須與 amazon-connect-chatjs 或 amazon-connect-taskjs 結合使用，才能利用 Amazon Connect 的聊天或任務功能。
要了解有關 Amazon Connect 及其功能的更多信息，請查看 Amazon Connect 使用者指南。
amazon-connect-streams 可從 npmjs.com 取得。如果您想在此處下載它，您可以使用任一文件，例如release/connect-streams* 。
運行npm run release以產生新的發布文件。下面可以找到使用 npm 進行本地建置的完整說明。
在 1.x 版本中，我們也支援舊版的make 。該選項在 2.x 版本中被刪除。
voiceConnection.muteParticipant()voiceConnection.unmuteParticipant()agent.mute()agent.unmute()voiceConnection.muteParticipant()voiceConnection.unmuteParticipant()agent.mute()agent.unmute()isSilentMonitor 、 isBarge 、 isSilentMonitorEnabled 、 isBargeEnabled 、 isUnderSupervision 、 updateMonitorParticipantState 、 getMonitorCapabilities 、 getMonitorStatus 、 isForcedMute 。initCCP將不再將多個嵌入式 CCP 附加到窗口，並且只有第一次呼叫initCCP才會成功。請注意，Streams 從未支援使用initCCP初始化多個 CCP 的用例，添加此變更是為了防止此類情況產生不可預測的行為。agent.onContactPending已被刪除。請改用contact.onPending 。 connect.onError現在觸發。以前，這個api根本不行。請注意，如果您在此函數中具有應用程式邏輯，則其行為已變更。有關更多詳細信息，請參閱 Documentation.md 中的條目。agent.setState()來切換代理狀態，您將需要更新程式碼才能使用此功能：enqueueNextState: true來觸發 Next Status 行為。agent.setState()使用 Next Status 功能，也請確保您的程式碼在清除聯絡人後使用contact.clear()而不是contact.complete() 。FailedConnectAgent 、 FailedConnectCustomer和AfterCallWork 。FailedConnectAgent以前，我們要求代理程式點擊「清除聯絡人」按鈕來清除此狀態。當客服人員點擊「清除聯絡人」按鈕時，先前的行為會毫無疑問地將客服人員回到Available狀態。現在， FailedConnectAgent狀態將被“自動清除”，就像FailedConnectCustomer一直以來的情況一樣。FailedConnectAgent和FailedConnectCustomer我們現在使用contact.clear() API 自動清除這些狀態。結果，代理將返回到先前的可見代理狀態（例如Available ）。以前，由於這種“自動清除”行為，代理始終設定為Available ”。請注意，對於FailedConnectAgent和FailedConnectCustomer的此更新，即使是自訂 CCP 也會有不同的行為。AfterCallWork —— 作為新contact.clear()行為的一部分，在AfterCallWork中點擊「清除聯絡人」將使座席回到先前的可見座席狀態（例如， Available等）。請注意，實現自己的呼叫後工作行為的自訂 CCP 將不會受到此變更的影響。contact.complete()置於棄用路徑上。因此，您應該開始使用contact.clear()來取代它。如果您想在客戶 CCP 中模擬 CCP 的 After Call Work 行為，請確保在清除語音聯絡人時使用contact.clear() 。 如果您要遷移到新的 CCP，我們鼓勵您升級到此儲存庫的最新版本。如果您正在使用 RTC-JS，您也應該升級到最新版本。有關新 CCP 的完整遷移指南，並充分了解將 Streams 與新 CCP 結合使用時的差異，請參閱此文章：https://docs.aws.amazon.com/connect/latest/adminguide/upgrade-to -最新-ccp.html
使用 Streams 的第一步是將您想要嵌入的頁面列入白名單。為了客戶的安全，我們要求將特定執行個體嵌入 CCP 的所有網域明確列入白名單。每個域條目標識協定方案、主機和連接埠。託管在相同協定方案、主機和連接埠後面的任何頁面都將被允許嵌入使用 Streams 庫所需的 CCP 元件。
要將您的頁面列入白名單：
npm install amazon-connect-streams
import "amazon-connect-streams";這將使connect變數在當前上下文中可用。
amazon-connect-streams與 TypeScript 相容。您需要使用3.0.1或更高版本：
import "amazon-connect-streams" ;
connect . core . initCCP ( { /* ... */ } ) ; 將 Connect 嵌入應用程式的下一步是從 GitHub 下載 Streams 程式庫。您可以透過在此處複製我們的公共儲存庫來做到這一點：
$ git clone https://github.com/aws/amazon-connect-streams
下載串流後，切換到目錄並建立它：
$ cd amazon-connect-streams
$ make
這將產生一個名為connect-streams-${VERSION}.js的文件，這是您希望包含在頁面中的完整 Connect Streams API。您可以透過 Web 應用程式提供connect-streams-${VERSION}.js 。
安裝 NodeJS 的最新 LTS 版本
$ git clone https://github.com/aws/amazon-connect-streams
$ cd amazon-connect-streams
$ npm install
$ npm run release
在發布目錄中尋找建置工件 - 這將產生一個名為connect-streams.js的檔案以及相同connect-streams-min.js的縮小版本 - 這是您希望包含在頁面中的完整 Connect Streams API。
運行單元測試：
$ npm run test-mocha
注意：這些測試在上面產生的發布文件上運行
您還需要安裝gulp 。您可以全域安裝gulp 。
$ npm install -g gulp
$ git clone https://github.com/aws/amazon-connect-streams
$ cd amazon-connect-streams
$ npm install
$ npm run release
在發布目錄中尋找建置工件 - 這將產生一個名為connect-streams.js的檔案以及相同connect-streams-min.js的縮小版本 - 這是您希望包含在頁面中的完整 Connect Streams API。
運行單元測試：
$ npm run gulp-test
注意：這些測試在上面產生的發布文件上運行
Streams 在./src/aws-client.js檔案中具有 AWS-SDK 的「內建」版本。確保您在 AWS 開發工具包之前匯入 Streams，以便綁定到Window AWS對像是您手動包含的開發工具包中的對象，而不是來自 Streams 的對象。
初始化 Streams API 是驗證所有設定是否正確並且能夠偵聽事件的第一步。
connect.core.initCCP() <!DOCTYPE html >
< html >
< head >
< meta charset =" UTF-8 " >
< script type =" text/javascript " src =" connect-streams-min.js " > </ script >
</ head >
<!-- Add the call to init() as an onload so it will only run once the page is loaded -->
< body onload =" init() " >
< div id =" container-div " style =" width: 400px; height: 800px; " > </ div >
< script type =" text/javascript " >
var containerDiv = document . getElementById ( "container-div" ) ;
var instanceURL = "https://my-instance-domain.my.connect.aws/ccp-v2/" ;
// initialize the streams api
function init ( ) {
// initialize the ccp
connect . core . initCCP ( containerDiv , {
ccpUrl : instanceURL , // REQUIRED
loginPopup : true , // optional, defaults to `true`
loginPopupAutoClose : true , // optional, defaults to `false`
loginOptions : { // optional, if provided opens login in new window
autoClose : true , // optional, defaults to `false`
height : 600 , // optional, defaults to 578
width : 400 , // optional, defaults to 433
top : 0 , // optional, defaults to 0
left : 0 // optional, defaults to 0
} ,
region : "eu-central-1" , // REQUIRED for `CHAT`, optional otherwise
softphone : { // optional, defaults below apply if not provided
allowFramedSoftphone : true , // optional, defaults to false
disableRingtone : false , // optional, defaults to false
ringtoneUrl : "[your-ringtone-filepath].mp3" , // optional, defaults to CCP’s default ringtone if a falsy value is set
allowFramedVideoCall : true , // optional, default to false
allowEarlyGum : true //optional, default to true
} ,
task : {
disableRingtone : false , // optional, defaults to false
ringtoneUrl : "[your-ringtone-filepath].mp3" // optional, defaults to CCP's default ringtone if a falsy value is set
} ,
pageOptions : { //optional
enableAudioDeviceSettings : false , //optional, defaults to 'false'
enableVideoDeviceSettings : false , //optional, defaults to 'false'
enablePhoneTypeSettings : true //optional, defaults to 'true'
} ,
shouldAddNamespaceToLogs : false , //optional, defaults to 'false'
ccpAckTimeout : 5000 , //optional, defaults to 3000 (ms)
ccpSynTimeout : 3000 , //optional, defaults to 1000 (ms)
ccpLoadTimeout : 10000 //optional, defaults to 5000 (ms)
} ) ;
}
</ script >
</ body >
</ html >透過將位於ccpUrl的預先建置 CCP 載入到 iframe 中並將其放入提供的containerDiv中，與 Connect 整合。 API 要求透過此 CCP 和代理進行匯集，並且透過它發布聯絡資訊更新並提供給您的 JS 用戶端程式碼。
ccpUrl ：CCP 的 URL。這是您通常會導航到的頁面，以便在獨立頁面中使用 CCP，每個實例都不同。region ：Amazon connect 實例區域。例如： us-west-2 。僅聊天頻道需要。loginPopup ：可選，預設為true 。設定為false以停用登入彈出窗口loginOptions ：可選，僅當loginPopup設定為true時有效。提供具有以下屬性的對象，以在新視窗而不是新選項卡中開啟登入彈出視窗。autoClose ：可選，預設為false 。設定為true可在使用者登入後自動關閉登入彈出視窗。height ：這允許您定義登入彈出視窗的高度。width ：這允許您定義登入彈出視窗的寬度。top ：這可讓您定義登入彈出視窗的頂部。left ：這可讓您定義登入彈出視窗的左側。loginPopupAutoClose ：可選，預設為false 。與loginPopup參數一起設定為true以便在身份驗證步驟完成後自動關閉登入彈出視窗。如果登入頁面在新分頁中打開，此參數也會自動關閉該分頁。如果使用這些選項，也可以在loginOptions中設定。loginUrl ：可選。允許使用自訂 URL 來啟動 ccp，就像 SAML 驗證的情況一樣。softphone ：此物件是可選的，可讓您指定有關 Connect 的軟體電話功能的一些設定。allowFramedSoftphone ：通常情況下，不允許在 iframe 中託管軟體電話麥克風和揚聲器組件。這是因為軟體電話必須託管在單一視窗或選項卡中。在軟體電話呼叫過程中不得關閉託管軟體電話會話的窗口，否則通話將會被中斷。如果allowFramedSoftphone為true ，則將允許在此視窗或標籤中託管軟體電話元件。disableRingtone ：此選項可讓您完全停用來電時播放的內建鈴聲音訊。ringtoneUrl ：如果未停用鈴聲，則允許使用使用者可存取的任何瀏覽器支援的音訊檔案覆蓋鈴聲。若要使用預設鈴聲，請註解掉此行。pageOptions ：此物件是可選的，可讓您配置在設定標籤中顯示哪些配置部分。enableAudioDeviceSettings ：如果為true ，設定選項卡將顯示用於配置代理本地電腦的音訊輸入和輸出裝置的部分。如果false ，或未提供pageOptions ，代理程式將無法從設定標籤變更音訊裝置設定。將不會顯示。enableVideoDeviceSettings ：如果為true ，設定標籤將顯示用於設定代理本機電腦的視訊輸入裝置的部分。如果false ，或未提供pageOptions ，代理程式將無法從設定標籤變更視訊裝置設定。將不會顯示。enablePhoneTypeSettings ：如果true ，或未提供pageOptions ，設定標籤將顯示用於配置代理的電話類型和座機號碼的部分。如果為false ，客服人員將無法從設定標籤變更電話類型或座機號碼。shouldAddNamespaceToLogs ：將[CCP]新增至 CCP 記錄的所有日誌中。重要提示：在命名空間被加入之前，CCP 會產生一些日誌。ccpAckTimeout ：以毫秒為單位的超時，指示流等待 iframed CCP 響應其SYNCHRONIZE事件發射的時間。這些從第一次呼叫initCCP開始就連續發生。它們僅應在出現需要刷新或重新登入的問題時出現。ccpSynTimeout ：以毫秒為單位的逾時，指示流將等待將新的SYNCHRONIZE事件傳送到 iframed CCP 的時間。這些從第一次呼叫initCCP開始就連續發生。ccpLoadTimeout ：以毫秒為單位的逾時，指示在 CCP 仍處於正常狀態時流將等待來自共享工作線程的初始ACKNOWLEDGE事件的時間。 containerDiv或套用下列 CSS 規則來顯示或隱藏預先建置的 UI： # container-div iframe {
display : none;
}width: 100%; height: 100% 。若要自訂 CCP 的大小，請設定容器元素的寬度和高度。請查看此處的完整文檔，以了解有關以程式設計方式訂閱事件和執行狀態變更的更多資訊。
