前端接入阿里云外呼SDK

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

<!--sdk样式文件-->
<link
rel="stylesheet"
type="text/css"
href="//g.alicdn.com/cloudcallcenter/web-workbench-sdk/2.3.15/main.min.css"
/>
<!--阿里云云呼叫SDK-->
<script type="text/javascript" src="//g.alicdn.com/cloudcallcenter/SIPml/0.3.2/SIPml-api.js"></script>
<script type="text/javascript" src="//g.alicdn.com/cloudcallcenter-voip/web-agentbar-sdk/1.7.6/index.js"></script>
<script
type="text/javascript"
src="//g.alicdn.com/cloudcallcenter/web-workbench-sdk/2.3.15/workbenchSdk.min.js"
></script>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
window.workbench = new window.WorkbenchSdk({
accessKeyId: 外呼后台获取,
accessKeySecret:外呼后台获取,
regionId: 外呼后台获取',
instanceId: 外呼后台获取', //后台申请的id，必选配置
RPCEndPoint: '....',
apiVersion: '....',
exportErrorOfApi: true,
dom: 'workbenchDom', //必选配置
onInit: function() {
console.log('------sdk init success------');
window.workbench.register();//自动进行注册
window.workbench.changeVisible(false);//是否显示呼叫默认的面板，可通过组件传递的参数控制
},
onCallDialing: function() {
console.log('------//去电、拨号振铃时触发------');
this.$emit()// 可以通过emit或者eventbus的方式外部触发事件。
},
onBeforeCallDialing: function(payload) {
console.log('------before call dialing------', payload);
payload.callback(); //必须执行callback，否则不会拨号
},
//还有很多钩子函数，根据需要调用
});

1
2
3
4
5
6
7
 <!-- 阿里云呼叫组件 isShowPanel是否显示呼叫面板-->
<workbench
ref="workbench"
:isShowPanel="false"
@youEmitHandle="youEmitHandle"
></workbench>

1
2
3
4
 window.workbench.call('', '');//拨打电话
window.workbench.hangUp();//挂断电话
... some...