Skip to content

微信小程序开始开发

本文档详细介绍如何开发微信小程序接入产品平台。

安装开发者工具

准备:下载并安装 微信开发者工具

数据交互流程

截图

一、呼叫页面 引入 mainCall-1.0.0.min.js

二、引入组件trtcCall、挂载组件(填写参数,请参照demo /pages/index)

三、呼叫页面在onLoad配置:

a、配置信息

javascript


const config = {
        serviceURL: "https://testcc.easycalls.cn/did-api", //请求地址
        token: { key: "TOKEN", value: "123456" }, // 你们服务器返回的token {key:请求头名,value:请求头值}: (选填)
        map:{
          url:'https://us1.locationiq.com/v1/reverse',
          key:'', // 官网注册key
          data:{"format":'json',"zoom":6,"accept-language":'zh-CN'},
          latitude:'lat',
          longitude:'lon',
          method:'GET'
        },
        caller: "", //主叫号码
        companyId: "", // 公司ID 
        userId: "", //用户ID
        routes: {
          //你服务器请求接口
          startCall: "callApi/startCall", //开始呼叫(必填)
          alertCall: "callApi/alertCall", // 振铃(必填)
          endCall: "callApi/endCall", //结束(必填)
          queryCall: "callApi/queryCall", // 查询状态(必填)
          toneClick: "callApi/toneClick", //ivr按键(必填)
          callerAuthType: "callApi/callerAuthType", //黑白名单(必填)
          gisAuth: "callApi/gisAuth", //地理位置(必填)
          userProfile: "customerApi/profile", //用户信息(必填)
        },
      };

b、配置回调,返回 status 非0时处理事项,(选填)

javascript
   const callBack = (res) => {
     const {data: { message }} = res;
     CallClient.showErrMsg({ title: message, duration: 5000 });
   };

c、初始化CallClient

javascript
  const callclient = (this.callclient = new CallClient(config, callBack));

d、挂载到全局

javascript

  getApp().globalData.callclient = callclient;

四、开始拨号

javascript
  //注意启动拨号需要防抖,防止多次点击(5秒以上才能触发第二次)
      const pusherAttributes = this.TRTC.createPusher({ beautyLevel: 9 });
      this.setData({ pusher: pusherAttributes });
      try {
        this.setData({ isCalling: true });
        const { cdrId, pusher } = await this.callclient.doCall({ called: this.data.called });
        this.setData({ cdrId, pusher });
      } catch (error) {
        this.setData({ isCalling: false });
      }

五、挂断电话

javascript

  const { pusher, playerList } = await this.callclient.hangUp({ cdrId: this.data.cdrId });
  this.setData({ pusher, playerList, isCalling: false });

六、设置切换听筒、扬声器

javascript
  //ear:听筒,speaker:扬声器
    const players = this.TRTC.getPlayerList();
    players.forEach((player) => {
      this.setData({
        playerList: this.TRTC.setPlayerAttributes(player.streamID, { soundMode: 'ear' }),
      });
    });

七、聆听远程通话状态

javascript

  remoteIsCallIng(e) {
      // isCalling:挂线 false , 通话 true
      const isCalling = e.detail.isCalling;
    }

八、监听呼叫状态

javascript

  callStatus(e) {
    /*
      0:呼叫不存在
      1:初始呼叫状态
      2:RTMP请求状态
      3:正在外呼状态
      4:呼叫振铃状态
      5:呼叫接通状态
      当状态到5时就不在再发送
    */
    const callStatus = e.detail.callStatus;
    console.log("callStatus", callStatus);
  },

九、发送ivr按键

javascript

   await this.callclient.sendTone({ cdrId, tone:'1' });