首页 > API中心 > IVR群呼 > 文档指引

快速入门-CC SDK接入

呼叫中心

CC SDK对接流程

SDK 初始化流程

在head标签中创建 <script src="https://cc-sdk.itniotech.com/sip-sdk.js"></script>
获取到token后，调用window.ccSdk.register传入token完成初始化操作
生成SDK凭证接口说明

register方法

注册SDK

参数	类型	是否必填	备注
token	string	是	sdk token(接口生成)
noWorkMode	Boolean	否	sdk是否开启无工作台模式(true: 开启，false：关闭，默认false)
isRemark	Boolean	否	是否展示备注(开启：true，关闭：false，默认true)
isInformation	Boolean	否	是否展示被叫信息(开启：true，关闭：false，默认true)
lang	string	否	当前显示语种(默认显示英语) en：英语，es：西班牙语
closeInitiateCall	Boolean	否	是否关闭主动拨号功能(默认不关闭)。false: 不关闭，true: 关闭

                  示例：
<!DOCTYPE html>
<html lang="">
  <head>
    <script src="https://cc-sdk.itniotech.com/sip-sdk.js"></script>
  </head>
  <body>
    <!-- sdk 组件 -->
    <cc-sdk id="sdk"></cc-sdk>

    <script type="module">
      import http from 'axios'

      //1、为了保证鉴权信息安全，需要由客户系统后端服务实现SDK鉴权能力，并且将该接口暴露至客户前端使用，客户后端系统接入鉴权能力文档可见（https://itniotech.cn/api/call/ccsdkAuthentication/）
      //2、'https://xxx.xx.cn/createAuth'路径需要替换成客户系统的后端接口
      //3、整体请求路径说明：[客户系统前端]->[客户后端接口]->[我方API接口]
      //4、SDK注册仅需要一行代码window.ccSdk.register({token:xxx})，下方示例发送的post请求仅做参考，目的是从后台接口拿取到toekn，具体实现逻辑可自定义
      http.post('https://xxx.xx.com/createAuth', res => {
        window.ccSdk.register({
          token: res.data,
          noWorkMode: false,
          isRemark: true,
          isInformation: true,
        })
      })
    </script>
  </body>
</html>

监听SDK - 坐席状态

通过给sdk组件添加id，通过addEventListener监听seatStatus回调，如：

                  示例：
document.getElementById('sdk').addEventListener('onSeatStatus', option => {
    console.log('option:', option)
});

回调参数

参数	类型	备注
detail	array	坐席状态： 1:离线， 2:空闲， 3:示忙， 4:话后整理， 5:小休，

                  示例：
<!DOCTYPE html>
<html lang="">
  <head></head>
  <body>
    <!-- sdk 组件 -->
    <cc-sdk id="sdk"></cc-sdk>

    <script type="module">
      import { register } from 'sip-sdk.js'

      // 监听坐席状态
      const sdk = document.getElementById('sdk')
      sdk.addEventListener('onSeatStatus', (data) => {
        console.log('data:', data)
      })
    </script>
  </body>
</html>

监听SDK - 呼叫状态

通过给sdk组件添加id，通过addEventListener监听onCall回调，如：

                  示例：
document.getElementById('sdk').addEventListener('onCall', option => {
    console.log('option:', option)
});

回调参数

参数	类型	备注
detail
callStatus	Object	呼叫状态: 1-呼叫中, 2-响铃中, 3-通话中, 4-通话结束, 5-拒接或挂断(通话未建立)
calledNumber	Number	被叫号码
calledInfo	Array	被叫信息(温馨提示：此字段可能为空，请注意判断)

                  示例：
<!DOCTYPE html>
<html lang="">
  <head></head>
  <body>
    <!-- sdk 组件 -->
    <cc-sdk id="sdk"></cc-sdk>

    <script type="module">
      import { register } from 'sip-sdk.js'

      // 监听呼叫状态
      const sdk = document.getElementById('sdk')
      sdk.addEventListener('onCall', (option) => {
        console.log('option:', option)

      })
    </script>
  </body>
</html>

监听SDK - http请求状态

通过给sdk组件添加id，通过addEventListener监听onHttp回调，如：id.addEventListener('onHttp', option => {})

参数	类型	字段	备注
detail	Object	code	100200：未登录
detail	Object	message	接口返回信息

                  示例：
<!DOCTYPE html>
<html lang="">
  <head>
    <script src="https://cc-sdk.itniotech.com/sip-sdk.js"></script>
  </head>
  <body>
    <!-- sdk component -->
    <cc-sdk id="sdk"></cc-sdk>

    <script type="module">
      import http from 'axios'

      http.post('url', res => {
        window.ccSdk.register({
          token: res.data,
        })
      })
      
      // 监听http状态
      const sdk = document.getElementById('sdk')
      sdk.addEventListener('onHttp', (option) => {
        const res = option.detail[0]
        console.log('res:', res)
      })

    </script>
  </body>
</html>

监听SDK - webrtc状态

通过给sdk组件添加id，通过addEventListener监听onWebrtcStatus回调，如：id.addEventListener('onWebrtcStatus', option => {})。此参数每五秒推送一次

参数	类型	说明
detail	Array	webrtc状态：0-未连接，1-已连接

                  示例：
<!DOCTYPE html>
<html lang="">
  <head>
    <script src="https://cc-sdk.itniotech.com/sip-sdk.js"></script>
  </head>
  <body>
    <!-- sdk 组件 -->
    <cc-sdk id="sdk"></cc-sdk>

    <script type="module">
      import http from 'axios'

      http.post('url', res => {
        window.ccSdk.register({
          token: res.data,
        })
      })
      
      // 监听webrtc状态
      const sdk = document.getElementById('sdk')
      sdk.addEventListener('onWebrtcStatus', (option) => {
        console.log('option:', option)
      })

    </script>
  </body>
</html>

Event事件 - 调用通话 callPhone

调用sdk通话功能，给sdk组件添加id或者ref，调用callPhone(option)方法，如：id.callPhone(option)
注意：当当前通话还在话后整理状态时调用此方法，则会直接提交结束通话，进入下一通通话，当为响铃中、呼叫中、通话中，则不允许调用

参数		类型	是否必填	备注
option	phone	string	是	需要拨打的号码
option	info	string	否	被叫信息(最长1000字符，超出会被截取)
callback	code	number	否	0：成功；999901：无效号码；999905：仅示闲下可操作；999906：提交失败
callback	message	string	否	当前接听操作返回的信息

                  示例：
<!DOCTYPE html>
<html lang="">
  <head>
    <script src="https://cc-sdk.itniotech.com/sip-sdk.js"></script>
  </head>
  <body>
    <button id="call">拨号</button>
    <!-- sdk 组件 -->
    <cc-sdk id="sdk"></cc-sdk>

    <script type="module">
      import http from 'axios'

      http.post('url', res => {
        window.ccSdk.register({
          token: res.data,
        })
      })

      const sdk = document.getElementById('sdk')
      const call = document.getElementById('call')
      call.onclick = () => {
        const data = {
          phone: '13212345678', // 呼叫号码
          info: '张三 20岁 461385413131', // 被叫信息
        }
        sdk.callPhone(data)
      }
    </script>
  </body>
</html>

Event事件 - 重连webrtc

重新连接webrtc。给sdk组件添加id或者ref，调用callPhone()方法，如：id.reConnectWebrtc()。
温馨提醒：在 webrtc状态为未连接状态，即onWebrtcStatus回调为0，再调用此方法，且建议设置限制重连次数

                  示例：
<!DOCTYPE html>
<html lang="">
  <head>
    <script src="https://cc-sdk.itniotech.com/sip-sdk.js"></script>
  </head>
  <body>
    <button id="reConnect">重新连接webrtc</button>
    <!-- sdk 组件 -->
    <cc-sdk id="sdk"></cc-sdk>

    <script type="module">
      import http from 'axios'

      http.post('url', res => {
        window.ccSdk.register({
          token: res.data,
        })
      })

      const sdk = document.getElementById('sdk')
      const reConnect = document.getElementById('reConnect')

      sdk.addEventListener('onWebrtcStatus', (option) => {
        const data = option.detail[0]
        if(data === 0) {
          sdk.reConnectWebrtc()
        }
      })
    </script>
  </body>
</html>

Event事件 - 挂断通话

调用sdk挂断当前通话功能
给sdk组件添加id或者ref，调用hangupCall(callback)方法，如：id.hangupCall(callback)
callback：回调参数（此参数返回当前挂断的状态）

参数	类型	字段	备注
callback	Object	code	0:挂断成功；999901:挂断失败
callback	Object	message	当前挂断操作返回的信息

                  示例：
<!DOCTYPE html>
<html lang="">
  <head>
    <script src="https://cc-sdk.itniotech.com/sip-sdk.js"></script>
  </head>
  <body>
    <button id="hangup">挂断</button>
    <!-- sdk 组件 -->
    <cc-sdk id="sdk"></cc-sdk>

    <script type="module">
      import http from 'axios'

      http.post('url', res => {
        window.ccSdk.register({
          token: res.data,
        })
      })

      const sdk = document.getElementById('sdk')
      const hangup = document.getElementById('hangup')
      hangup.onclick = () => {
        sdk.hangupCall((data) => {
            // data中返回code、message
        })
      }
      
    </script>
  </body>
</html>

Event事件 - 切换坐席状态

调用sdk切换坐席状态功能
给sdk组件添加id或者ref，调用switchStatus(value)方法，注意此方法必须放在声明async函数下，否则await会抛出错误，如：

                  示例：
async function switchFn() {
    const res = await id.switchStatus(value)
}

参数示例

参数	类型	备注
value	number	坐席的状态，2：示闲，5：小休

回调参数

参数	类型	备注
res		switchStatus的返回结果，code为0代表正常调用，否则异常
code	number	0：切换成功，999001：不允许切换的状态
message	string	当前方法返回的信息

                  示例：
<!DOCTYPE html>
<html lang="">
  <head>
    <script src="https://cc-sdk.itniotech.com/sip-sdk.js"></script>
  </head>
  <body>
    <button id="switchDom">切换坐席状态</button>
    <!-- sdk 组件 -->
    <cc-sdk id="sdk"></cc-sdk>

    <script type="module">
      import http from 'axios'

      http.post('url', res => {
        window.ccSdk.register({
          token: res.data,
        })
      })

      const sdk = document.getElementById('sdk')
      const switchDom = document.getElementById('switchDom')
      switchDom.onclick = () => {
        const res = await sdk.switchStatus(2)
        console.log('switchStatus:', res)
      }
      
    </script>
  </body>
</html>

Event事件 - 接听电话 (answerCall)

当来电振铃时，调用sdk接听当前通话功能

给sdk组件添加id或者ref，调用answerCall(callback)方法，如：id.answerCall(callback)

callback：回调参数（此参数返回当前接听的状态）

Callback Parameter		Type	Description
callback	code	number	0：接通成功，999902：WebRTC 未初始化，999903：当前没有可接听的来电，999904：接听来电失败
callback	message	string	当前接听操作返回的信息

                  示例：
<!DOCTYPE html>
<html lang="">
  <head>
    <script src="https://cc-sdk.itniotech.com/sip-sdk.js"></script>
  </head>
  <body>
    <button id="answerCallDom">接听电话</button>
    <!-- sdk component -->
    <cc-sdk id="sdk"></cc-sdk>

    <script type="module">
      import http from 'axios'

      http.post('url', res => {
        window.ccSdk.register({
          token: res.data,
        })
      })

      const sdk = document.getElementById('sdk')
      const answerCallDom = document.getElementById('answerCallDom')

      answerCallDom.onclick = () => {
        sdk.answerCall((data) => {
            // Returns code and message in data
        })
      }

    </script>
  </body>
</html>

错误码列表

code	状态说明
0	成功
999901	无效号码
999902	WebRTC 未初始化
999903	当前没有可接听的来电
999904	接听来电失败
999905	仅示闲下可操作
999906	提交失败

注意事项

使用此SDK，系统必须为https域名，且浏览器必须支持webrtc
webrtc检测工具 https://zegodev.github.io/webrtcDemo-js/webrtccheck/index.html#

用法示例

生成SDK凭证

坐席振铃事件：主动推送

此页面的内容有帮助吗？

对接有疑问？联系我们的技术支持

ITNIO TECH API 专属 TG 技术对接频道，即时响应您的需求

前往Telegram联系

消息

语音

快速入门

语音API

快速入门

坐席端API

管理端API

快速入门

AI Agent API

平台 API

快速入门-CC SDK接入

此页面的内容有帮助吗？

短信

语音

行业

场景

消息

语音

快速入门

语音API

快速入门

坐席端API

管理端API

快速入门

AI Agent API

平台 API

快速入门-CC SDK接入

此页面的内容有帮助吗？