加入频道的Agora.io客户端在vuejs中无法正常工作

问题描述

created() {
    let $ = this;
    // init AgoraRTC local client
    const config = {
        mode: "rtc",codec:"h264",areaCode: [AgoraRTC.AREAS.GLOBAL]
    };
    $.client = AgoraRTC.createClient(config);
    $.client.init($.appId,() => {
      console.log("AgoraRTC client initialized");
      $.subscribeStreamEvents();
      $.client.join($.appId,$.channel,$.uid,function(uid) {
        console.log("User " + uid + " join channel successfully");
        console.log("At " + new Date().toLocaleTimeString());
        // create local stream
        // It is not recommended to setState in function addStream
        $.localStream = this.streamInit(uid,$.attendeeMode,$.videoProfile);
        $.localStream.init(
          () => {
            if ($.attendeeMode !== "audience") {
              $.addStream($.localStream,true);
              $.client.publish($.localStream,err => {
                console.log("Publish local stream error: " + err);
              });
            }
            $.readyState = true;
          },err => {
            console.log("getUserMedia Failed",err);
            $.readyState = true;
          }
        );
      },function(err) {
        console.error("client join Failed",err);
      });//end join
    });//end init
  },

使用npm安装的Agora

 npm i agora-rtc-sdk

“ agora-rtc-sdk”:“ ^ 3.1.2”, “ vue”:“ ^ 2.5.17”, “ vuetify”:“ ^ 2.2.9”

在上面的代码

$.client.join($.appId,function(uid) {

此行继续连接,但未成功,也未给出失败错误。它只是继续尝试连接到服务器。

这是错误/警告的屏幕截图

enter image description here

请帮助我,我坚持了2天 对不起,英语不好

解决方法

我认为文档对此有些棘手。 client.join()函数接受以下四个参数:

client.join(APPID,CHANNEL,TOKEN(can be null),UID(optional),function(uid){
  // uid returned
})

因此,将代码更新为:

$.client.join($.appId,$.channel,null,function(uid) {

我的VueJS项目实际上使用的是AgoraWebSDK NG。您可以在此处查看迁移指南:https://agoraio-community.github.io/AgoraWebSDK-NG/docs/en/migration_guide