微信小程序编写一个音视频会议系统附完整代码

教你如何使用微信小程序打造一个音视频会议系统

微信小程序越来越强大，从刚开始的页面渲染到游戏开发到视频语音直播，正在一步一步替代原生app的一些应用，今天我们来教大家用微信小程序开发一个最多同时300人开会的音视频会议聊天系统。效果如下：

第一步，音视频聊天目前只针对企业用户，并且做了类目限制，如下

上面这些类目可以开通音视频会议功能，这些类目大部分需要特殊资质的证明，只有最后一个类别it科技 硬件设备不需要特殊资质

小程序服务类别在小程序后台的设置里面修改

修改完成后我们进入小程序后台的开发-开发管理-接口设置 菜单中，我们把这下面三个开关打开

好了，现在我们来写小程序代码和后端php接口吧

wxml

<block wx:for="{{openIdList}}" wx:key="*this">
  <voip-room
    openid="{{item}}"
    mode="{{selfOpenId === item ? 'camera' : 'video'}}" style="height:300rpx;width:200rpx;">
  </voip-room>
</block>
<view bindtap="joinmeet">加入视频会议</view>

Page({
  data: {
    openIdList: [],
    selfOpenId: "",

  },
  onLoad: function () {
    var that = this;
    wx.login({
      complete: (res) => {
        if (res.code) {
          wx.request({
            method: "GET",
            data: {
              code: res.code
            },
            url: "http://xxxxx.com/", //后端接口地址
            success: (re) => {
              var data = re.data
              that.setData({
                data: data,
                selfOpenId: data.openid
              })
            }
          })
        }
      },
    })
  },
   onUnload:function(){
    wx.exitVoIPChat();//退出视频聊天
  },
  joinmeet() {
    var that = this
    wx.getSetting({
      success: function (r) {...

点击查看剩余70%