当我将它传递给 socket io 时，对象失去了它的原型函数

Question

我正在使用 Agora.io sdk 创建群组视频聊天应用程序。它们为开发人员提供了一个流对象，该对象包含构建应用程序所需的重要方法和属性。但是，当我将它传递给 socket io 时，它就失去了它的功能。我怎么解决这个问题。我看到一些问题提出了类似的问题，但它们没有提供能够帮助我的答案。下面是我发出的代码：

function UIControls (stream, streamType, streamDiv) {
    console.log('inside UIControls :::', stream.streamId, stream.getId(), typeof(stream) === 'function')

    // video button
    var videoButton = document.createElement('button');
    // videoButton.setAttribute('id', 'videoButton');
    videoButton.setAttribute('id', 'video_'+String(stream.getId()));
    videoButton.innerHTML = '<i class="fas fa-video"></i>';
    var clicked = false;
    videoButton.addEventListener('click', function(evt) {
        toggleVideo(stream);
    })
    if (streamType === 'me') {
        $('#me').append(videoButton);
    } else {
        $('#' + String(stream.getId())).append(videoButton);
    } 

    function toggleVideo(stream) {
        if (clicked) {
            videoButton.innerHTML = '<i class="fas fa-video-slash"></i>';
            socket.emit("sendPeerInfo_video", {
                "type": "mute",
                "id": String(stream.getId()),
            });
            clicked = false;
        } else {
            // stream.unmuteVideo();
            videoButton.innerHTML = '<i class="fas fa-video"></i>';
            socket.emit("sendPeerInfo_video", {
                "type": "unmute",
                "id": String(stream.getId()),
                "stream": stream,
            });
            clicked = true;
        }
    }

}

这里是 socket.on 代码：

socket.on("sendPeerInfo_video", function (evt) {
    if (evt.type === 'mute') {
        evt.stream.muteVideo();
        return $('#video_'+evt.id)[0].innerHTML = '<i class="fas fa-video-slash"></i>'
    } else if (evt.type === 'unmute') {
        evt.stream.unmuteVideo();
        return $('#video_'+evt.id)[0].innerHTML = '<i class="fas fa-video"></i>'
    }
});

我无法再访问 socket.on

中的 evt.stream.muteVideo() 和 evt.stream.unmuteVideo() 函数

感谢您的帮助！

Answer 1

您使用自己的套接字有什么特别的原因吗？

看看这个 sample app which takes care of group video calls and screen sharing along with features like muting and unmuting made using the official Agora.io Documentation。

显示您实际需要为您提供的功能执行的操作的片段示例：

var client = AgoraRTC.createClient({mode: 'rtc', codec: 'vp8'}); 
var localStreams = {
  uid: '',
  camera: {
    camId: '',
    micId: '',
    stream: {}
  }
};

// Hide video
client.on("mute-video", function (evt) {
  var remoteId = evt.uid;
   localStreams.camera.stream.muteVideo();
});

// Show video
client.on("unmute-video", function (evt) {
 localStreams.camera.stream.unmuteVideo();
});

// Mute audio
client.on("mute-audio", function (evt) {
  var remoteId = evt.uid;
   localStreams.camera.stream.muteAudio();
});

// Unmute audio
client.on("unmute-audio", function (evt) {
 localStreams.camera.stream.unmuteAudio();
});

Agora 自动为每个人静音和取消静音，无需您自己制作相同的插座。

如果您的用例有所不同，但需要您使用自定义套接字，请在评论中告诉我。

编辑： 要实现举手功能以及将其他人静音或取消静音，您可以使用 Agora RTM using this quick start guide or this sample app.

RTM 的作用类似于您的个人网络套接字，可用于发送显示给其他用户（用于聊天）的消息，甚至可以执行一些幕后工作，例如接收特定类型的消息并执行相应的行动。

如果管理员想将其他人设为静音，他们可以单击一个按钮，该按钮会触发向用户发送 RTM 消息，并自动解析并使用此消息将其设为静音 him/her。举手将以类似的方式工作。

当我将它传递给 socket io 时，对象失去了它的原型函数

Object losing its prototype functions when I pass it to socket io

javascript

socket.io

agora.io