通过wx.joinVoIPChat调用voip-room 后加入的成员不能及时显示画面,求解?
发布于 7 年前 作者 vzhong 6432 次浏览 来自 问答

通过  wx.joinVoIPChat API调用成员后,

第一个加入的成员可以正常显示,

第二个成员能显示出黑色占位框,有声音,但不能显示画面,如果占击分享后返回,则可以刷新 出画面

加入时界面

点击邀请后界面

源码:

wxml

  <view class="view_room" wx:if="{{m1.indexOf(openIdList, cid) > -1}}">
    <block wx:for="{{openIdList}}" wx:key="*this">
      <voip-room openid="{{item}}" mode="{{selfOpenId === item ? 'camera' : 'video'}}"></voip-room>
    </block>

    <block wx:for="{{blankview}}" wx:key="*this">
      <view class="view_yq">
        <view>+ 邀请</view>
        <button open-type="share" title="邀请"></button>
      </view>
    </block>

  </view>

  <view class="room_esc" wx:else>
    房间已经被解散!
  </view>

<view style="display:none;color:#fff">
  {{openIdList.length}} - {{joinVoIPChat}}
  <view>{{openIdList}}</view>
  <view>signature:{{signature}}</view>
  <view>nonceStr:{{nonceStr}}</view>
  <view>timeStamp:{{timeStamp}}</view>
  <view>groupId:{{groupId}}</view>
  <view>cid:{{cid}}</view>
  <view>selfOpenId:{{selfOpenId}}</view>
  <view>session_key:{{session_key}}</view>
</view>
<view style="height:60px;"></view>

<view class="room_menu">
  <view bindtap="goMuteConfig" data-v="muteMicrophone"><text class="fal fa-microphone{{room_menu[1]}}"></text>{{room_menu[0]}}</view>
  <view bindtap="goMuteConfig" data-v="muteEarphone"><text class="fal fa-volume{{room_menu[4]}}"></text>{{room_menu[3]}}</view>
  <navigator bindtap="goExit" wx:if="{{selfOpenId == cid}}"><text class="fal fa-power-off"></text>结束面试</navigator>
  <navigator target="miniProgram" open-type="exit" wx:else><text class="fal fa-power-off"></text>退出面试</navigator>
</view>

<wxs module="m1">
  function defineIndexOf(str, val) {
    return str.indexOf(val);
  }
  module.exports = {
    indexOf: defineIndexOf
  }
</wxs>

js

const app = getApp()
Page({

  /**
   * 页面的初始数据
   */
  data: {
    groupId : '',

    joinVoIPChat:'0',
    openIdList:[],
    blankview: ['','','',''],
    room_menu:['开启话筒'''false'开启声音'''false],

    yq_img:''
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    this.setData({
      selfOpenId: app.globalData.openid,
      session_key: app.globalData.session_key,
      cid: ( options.cid != '' && options.cid != undefined ) ? options.cid : app.globalData.openid,
    })
    wx.showLoading({mask: false })
  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {
    var _this =this;

    //设置是否保持常亮状态。仅在当前小程序生效,离开小程序后设置失效
    wx.setKeepScreenOn({
      keepScreenOn: true
    })

    wx.request({
      url: app.api_url + 'Room/index/' + app.globalData.openid + '/' + app.globalData.userid,
      data: {openid:_this.data.cid, session_key:app.globalData.session_key},
      header: { 'content-type''application/x-www-form-urlencoded' },
      method: 'POST',
      success(res) {

        _this.setData(res.data)

        //加入 (创建) 实时语音通话
        wx.joinVoIPChat({
          signature:  res.data.signature,
          nonceStr:   res.data.nonceStr,
          timeStamp:  res.data.timeStamp,
          groupId:    res.data.groupId,
          roomType:   'video',
          success(res){
            console.log(res)
            _this.setData({
              openIdList: res.openIdList,
              blankview: Array.apply(null,{length: (4 - res.openIdList.length) }) 
            })
            wx.hideLoading();
          },
          fail(res){
            _this.setData({
              joinVoIPChat:'fail' + res.errCode + res.errMsg
            })
          }
        })

        //订阅视频画面成员。对于视频房间,当成员超过两人时需进行订阅,否则只能看到最先加入房间的两人画面。
        wx.subscribeVoIPVideoMembers({
          openIdList: _this.data.openIdList,
          success(res){
            console.log('subscribeVoIPVideoMembers success')
          }
        })

        //监听实时语音通话成员在线状态变化事件。有成员加入/退出通话时触发回调
        wx.onVoIPChatMembersChanged(function(res){
          _this.setData({
            openIdList: res.openIdList, 
            blankview: Array.apply(null,{length: (4 - res.openIdList.length) }) 
          })
          //订阅视频画面成员。对于视频房间,当成员超过两人时需进行订阅,否则只能看到最先加入房间的两人画面。
          wx.subscribeVoIPVideoMembers({
            openIdList: _this.data.openIdList,
            success(res){
              console.log('subscribeVoIPVideoMembers success_b')
            }
          })
        })

      }
    })

    setInterval(function(){_this.onShow;console.log('setInterval 10')}, 10000);
  },

  goMuteConfig:function(e){
    if( e.currentTarget.dataset.v == 'muteMicrophone' ){
      ifthis.data.room_menu[1] == '' ){
        this.setData({room_menu: ['关闭话筒''-slash'truethis.data.room_menu[3], this.data.room_menu[4], this.data.room_menu[5]]})
      }else{
        this.setData({room_menu: ['开启话筒'''falsethis.data.room_menu[3], this.data.room_menu[4], this.data.room_menu[5]]})
      }
    }else{
      ifthis.data.room_menu[4] == '' ){
        this.setData({room_menu: [this.data.room_menu[0], this.data.room_menu[1], this.data.room_menu[2],'关闭声音''-slash'true]})
      }else{
        this.setData({room_menu: [this.data.room_menu[0], this.data.room_menu[1], this.data.room_menu[2],'开启声音'''false]})
      }
    }
    wx.updateVoIPChatMuteConfig({
      muteConfig:{
        muteMicrophone: this.data.room_menu[2],
        muteEarphone: this.data.room_menu[5]
      }
    })
  },
  goExit:function(){
    wx.exitVoIPChat();
    // wx.redirectTo({url: 'index'})
    wx.navigateBack({delta:1})
  },

  
  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {
    wx.exitVoIPChat();
  },

  
  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {
    var _this = this
    return {
      title: '邀请您加入远程面试',
      path: '/pages/call/share?cid=' + app.globalData.openid,
      imageUrl: _this.data.yq_img,
      success: function (res) {
        console.log('转发成功' + app.globalData.openid)
      }
    }
  }
})
2 回复

微信公众平台 小程序 日志查看

Cannot read property ‘length’ of undefined

TypeError: Cannot read property ‘length’ of undefined

at success (weapp:///pages/call/room.js:64:73)

at Function.i.<computed> (eval at n.call.document (http://127.0.0.1:34549/remote-debug/runtime.js?devtools_ignore=true:1:8784), <anonymous>:2:1967500)

at <api joinVoIPChat success callback function>

at Object.eval [as success] (eval at n.call.document (http://127.0.0.1:34549/remote-debug/runtime.js?devtools_ignore=true:1:8784), <anonymous>:2:122209)

at b (eval at n.call.document (http://127.0.0.1:34549/remote-debug/runtime.js?devtools_ignore=true:1:8784), <anonymous>:2:905316)

at v (eval at n.call.document (http://127.0.0.1:34549/remote-debug/runtime.js?devtools_ignore=true:1:8784), <anonymous>:2:905554)

at eval (eval at n.call.document (http://127.0.0.1:34549/remote-debug/runtime.js?devtools_ignore=true:1:8784), <anonymous>:2:906945)

at Object.u (eval at n.call.document (http://127.0.0.1:34549/remote-debug/runtime.js?devtools_ignore=true:1:8784), <anonymous>:2:77760)

at u (http://127.0.0.1:34549/remote-debug/runtime.js?devtools_ignore=true:1:8519)

at w (http://127.0.0.1:34549/remote-debug/runtime.js?devtools_ignore=true:1:17712)

Cannot read property ‘toString’ of undefined

TypeError: Cannot read property ‘toString’ of undefined

at i.Ke.<computed> [as fillText] (https://lib/WASubContext.js:2:928216)

at i.p.<computed> [as fillText] (https://lib/WASubContext.js:2:740040)

at et._drawImage (https://pages/ad/canvas.js:146:13)

at et._getImageInfo (https://pages/ad/canvas.js:117:14)

at Function.<anonymous> (https://pages/ad/canvas.js:88:14)

at https://lib/WASubContext.js:2:112543

at Function.<anonymous> (https://lib/WASubContext.js:2:94610)

at https://lib/WASubContext.js:2:101151

你好,麻烦具体描述问题流程,提供出现问题的具体机型、微信版本号、系统版本号,以及能复现问题的代码片段https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html

回到顶部