时间戳

首页 > 解决方案 > 忽略未定义的事件

javascript - 忽略未定义的事件

问题描述

我正在尝试使用 agora 视频通话。我可以让它连接并显示本地视频。但是，每当有新参与者加入呼叫时，控制台都会显示以下错误消息，而不是调用添加的流：

Ignoring event undefined {uid: "tO69JjBJ4wviREN_AAAH"}

该 UID 设置正确，因此事件被触发，它只是由于某种原因未定义。知道发生了什么吗？我在下面包含了我的代码以供参考：

// rtc object
var rtc = {
  client: null,
  joined: false,
  published: false,
  localStream: null,
  remoteStreams: [],
  params: {}
};

// Options for joining a channel
var option = {
  appID: "<APPID>",
  channel: roomName, //variable set elsewhere
  uid: null, 
  token: null //OK to be null
};


function startVideo(id){ //called from another file
  option.uid = id;

  initializeRTC();
}

function initializeRTC(){
    rtc.client = AgoraRTC.createClient({mode: "rtc", codec: "h264"});

  rtc.client.init(option.appID, function () {
    console.log("Initialized Agora SDK");
    joinChannel(option.channel);
    listenForRemoteStreams();
    }, (err) => {
    console.error(err);
  });
}

function joinChannel(){
  rtc.client.join(option.token, option.channel, option.uid, function (uid) {
      console.log("join channel: " + option.channel + " success, uid: " + uid);
      rtc.params.uid = uid;
      rtc.joined = true;
      createStream();
    }, function(err) {
      console.error("client join failed", err);
  });
}

function createStream() {
  rtc.localStream = AgoraRTC.createStream({
    streamID: rtc.params.uid,
    audio: true,
    video: true,
    screen: false,
  });

  rtc.localStream.init(function () {
    console.log("init local stream success");
    createRemoteVideoDiv(option.uid);
    rtc.localStream.play("remote-media-"+option.uid);
  }, function (err) {
    console.error("init local stream failed ", err);
  });
}


function publishStream(){
  console.log("publishing...");
  rtc.client.publish(rtc.localStream, function (err) {
    console.log("publish failed");
    console.error(err);
    return;
  });
  rtc.published = true;
}


function listenForRemoteStreams(){

  rtc.client.on("stream-added", function (evt) {  
    console.log("stream-added");
    var remoteStream = evt.stream;
    var id = remoteStream.getId();
    if (id !== rtc.params.uid) {
      rtc.client.subscribe(remoteStream, function (err) {
        console.log("stream subscribe failed", err);
      });
    }
    console.log("stream-added remote-uid: ", id);
  });


  rtc.client.on("stream-subscribed", function (evt) {
    console.log("stream-subscribed");
    var remoteStream = evt.stream;
    var id = remoteStream.getId();
    // Add a view for the remote stream.
    createRemoteVideoDiv(id);
    // Play the remote stream.
    remoteStream.play("remote-media-" + id);
    console.log("stream-subscribed remote-uid: ", id);
  });


  rtc.client.on("stream-removed", function (evt) {
    var remoteStream = evt.stream;
    var id = remoteStream.getId();
    // Stop playing the remote stream.
    remoteStream.stop("remote-media-" + id);
    // Remove the view of the remote stream. 
    removeView(id);
    console.log("stream-removed remote-uid: ", id);
  });

}



function createRemoteVideoDiv(id){
  var videoDiv = document.createElement("div");
  videoDiv.style.height = "120px";
  videoDiv.style.width = "120px";
  videoDiv.style.transform = 'scale(-1, 1)';
  videoDiv.style.clipPath = "circle(60px at center)";
  videoDiv.id = 'remote-media-'+id;
  document.getElementById("remote-media-div-"+id).appendChild(videoDiv);
}

标签： javascriptagora.io

解决方案

我认为您遇到了竞争条件，客户端在所有回调设置之前连接到通道。

尝试将您的更改initializeRTC为：


function initializeRTC(){
  rtc.client = AgoraRTC.createClient({mode: "rtc", codec: "h264"});
  listenForRemoteStreams();

  rtc.client.init(option.appID, function () {
    console.log("Initialized Agora SDK");
    joinChannel(option.channel);
    
    }, (err) => {
    console.error(err);
  });
}

推荐阅读