通過該文檔，您可以實現將IVR頁面嵌入到第三方系統中，直接在您系統中實現IVR流程的展示、編輯、發布等功能，下面的工作需要您公司的前端工程師來實施。
一、前端資源
備注：更新前端資源版本以后，一定要在本地環境做全面測試以后再發布線上環境！
<!--sdk樣式文件-->
<link rel="stylesheet" type="text/css" >
<!--sdk js文件-->
<script type="text/javascript" src="https://g.alicdn.com/cloudcallcenter/acc-ivr/{version-ivr-sdk}/accIvrSdk.min.js"></script>
以上靜態資源，將上面的{version-ivr-sdk}替換為對應的版本號，當前最新版本號為：
version-ivr-sdk ==> 1.14.1二、初始化SDK
接入SDK之前需要做的工作：
必須使用chrome瀏覽器，版本號為58以上。原因是云呼叫中心的通話是通過webRTC技術實現的，目前chrome瀏覽器對于WebRTC技術兼容是高的。為了保證您的通話質量及安全性，所以我們做出了這樣的要求。
初始化SDK：
window.accIvr = new window.AccIvrSdk(config)注意：當在同一個頁面重復初始化實例時，需在下次初始化之前調用 window.accIvr.unmountInstance()方法卸載上次渲染的組件，避免重復渲染組件，出現意外情況。
三、config必選配置
1. dom
掛載元素id2. instanceId
創建呼叫中心實例填寫的域名，
https://ccc.console.aliyun.com/AccV2Instance
訪問地址查看，workbench/xxx/agentdest中間的字符串（xxx就是實例id）
3. regionId
云呼服務器部署的集群，如果沒有特殊說明，為'cn-shanghai'四、config可選配置
1. width
寬度，默認100%，參數類型：Number （px）或者String（%）2. height
高度，默認100%，參數類型：Number （px）或者String（%）3. baseURL
加載IVR頁面的路徑。
如果是hash路由，是window.location.hash。
如果是browser路由，是window.location.pathname。4. isBrowserHistory
Boolean，如果是browser路由，指定為true。如果是hash路由可不指定。******以下參數是前端請求服務端接口的API地址及請求參數配置：******
請求路徑為：${ajaxOrigin}${ajaxPath}?${ajaxApiParamName}=${apiName}&product=CloudCallCenter&version=2020-07-01®ion=${regionId}
5. ajaxOrigin
請求源，默認請求當前源（location.origin），參數類型：String；6. ajaxPath
請求路徑，默認為”/data/api.json”7. withCredentials
表示跨域請求時是否需要使用憑證,是否允許攜帶cookie,參數類型：Boolean8. ajaxApiParamName
ajaxType為param時指定區分action的名稱，默認action，參數類型：String；9. ajaxMethod
請求方式，post|get 默認post，參數類型：String；10. ajaxOtherParams
其他自定義參數和request同一層級，參數類型：Object；11. ajaxHeaders
請求的header，參數類型：Object；uploadAudioPageUrl
自定義上傳音頻的頁面路徑，默認云呼控制臺的音頻上傳頁面（https://ccc-v2.aliyun.com/workbench/{InstanceId}/media）******請求接口的參數配置結束******
******以下是鉤子函數：路由變化時的回調函數，類型均為function******
13. onChangeRouter(url)
當路由發生變化時觸發。你可以根據路由變化做出相應處理以下是配置示例：
window.customIvr = new window.AccIvrSdk({
dom: 'ivr',
instanceId: 'XXX',
regionId: 'cn-shanghai',
ajaxPath: '/aliyun/ccc/api',
ajaxMethod: 'post',
useOpenApiSdk: false,
width: '800px',
height: '500px',
baseURL: '/ivr',
onChangeRouter(url) {
console.log(url);
},
});
五、SDK說明
IVR SDK中內置了一些路由配置，對應不同頁面和操作：
接口 | 描述 |
${baseURL} | IVR列表頁面 |
${baseURL}/delete | 刪除IVR |
${baseURL}/publish | 發布IVR |
${baseURL}/version | IVR版本信息 |
${baseURL}/export | 導出IVR |
${baseURL}/create | 創建新的IVR |
${baseURL}/modify/:contactFlowId | 編輯IVR |
${baseURL}/clone | 克隆IVR |
${baseURL}/import | 導入IVR |
六、服務端準備工作
因為IVR SDK是嵌入到了您的自有業務系統中，在IVR SDK的使用過程中，會發起多個請求到自有業務系統的服務端，請求的調用地址可以通過四、config可選配置中的ajax相關配置來設置。需要將IVR SDK發出的請求經過您的服務端轉發到云呼叫中心的服務端（也就是調用云呼叫中心的openAPI），然后將返回結果透傳回軟電話SDK中即可。詳細步驟如下：
可以通過AK/SK方式請求接口，或通過oauth2方式請求接口。
轉發SDK發的請求到云呼叫中心服務端，根據API概覽調用對應openAPI，將返回結果透傳回軟電話SDK即可，軟電話SDK所需的返回結果必須是JSON數據格式。
類型 | 接口 | 描述 |
業務接口 | ListContactFlows | 獲取IVR列表 |
GetContactFlowVersion | 獲取IVR流程版本信息 | |
ListSnapshotsOfContactFlow | 獲取IVR流程快照信息 | |
StartEditContactFlow | 開始編輯IVR流程 | |
PublishContactFlow | 發布IVR流程 | |
GetContactFlow | 獲取IVR流程畫布信息 | |
DiscardEditingContactFlow | 丟棄IVR流程編輯內容 | |
DeleteContactFlow | 刪除IVR流程 | |
RollbackContactFlow | 回滾IVR流程到指定版本 | |
ListSkillGroups | 獲取技能組列表信息 | |
ListPhoneNumbers | 獲取電話號碼列表 | |
GetSmsConfig | 獲取短信配置信息 | |
ListConfigItems | 獲取當前工作臺配置信息 | |
ListCallTags | 獲取黑名單標簽列表 | |
ListMedias | 獲取當前實例下的音頻列表 | |
DeleteMedia | 刪除音頻 | |
GetAudioFileDownloadUrl | 獲取指定音頻URL | |
ListAsrSettings | 獲取語音配置開啟狀態 | |
CheckNlsServiceStatus | 檢查智能語音服務是否授權 | |
ListProjects | 獲取語音項目列表 | |
GetTtsAuditionFile | 獲取文本試聽音頻鏈接 | |
ListBriefSkillGroups | 獲取簡單的技能組列表 | |
ListCustomizedVoiceNavigatorInstances | 獲取智能導航實例和號碼的映射 |
七、更新日志
v1.14.1
Features
設置變量節點，賦值時可以選擇變量
歷史版本添加草稿和刪除草稿
滿意度收集添加用戶掛機節點
添加視頻插播節點
添加轉移流程節點
收號節點添加dtmfSource字段
云呼叫中心改名為云聯絡中心
添加工作時間系統變量
優化編輯時的退出能力
部分功能的優化及使用體驗
v1.9.2
Features
用戶掛機分支可以連接到短信節點
保存時不驗證連線和配置，只在發布的時候驗證
連線節點驗證，連過用戶掛機分支的節點不能再連接話務節點
分支模塊自適應文字寬度，使用戶配置的時候能看全各個分支的內容，方便連線
v1.8.2
Features
收號節點和滿意度收集節點添加超時和錯誤提示音
v1.7.0
Features
優化部分API請求報錯的錯誤提示
v1.6.0
Bug Fixes
分支節點刪除或新增后節點數據連線異常
設置變量參數能選擇系統參數，應只能選擇自定義參數
Features
添加部分系統音頻
轉人工添加暫時離隊節點