Захват WebRTC на стороне вызывающего абонента не срабатывает после получения ответа

В моем многоранговом клиенте webrtc (тестирование на chrome) успешно установлено стабильное соединение, но после того, как я получил ответ от вызываемого, событие ontrack не запускается, и, следовательно, поток sourceObj не присоединен к моему DOM. Зачем? Вызываемый показывает оба видео (локальное и удаленное), но на стороне вызывающего удаленное видео не добавляется, и кажется, что это происходит из-за того, что событие ontrack не запускается.

Я создаю все RTCPeerConnection перед отправкой предложения / ответа и добавляю в него локальные треки во время создания после того, как я связал с ним события ontrack. Затем я отправляю предложение / ответ и слежу за процессом сигнализации.

class WebRTC_Client {

    private serversCfg = {
        iceServers: [{
            urls: ["stun:stun.l.google.com:19302"]
        }]
    };

    ...

    private gotStream(stream) {
        window.localStream = stream;
        ...
    }

    private stopLocalTracks(){
        if (window.localStream) { 
            window.localStream.getTracks().forEach(function (track) {
                track.stop();
            });
            var videoTracks = window.localStream.getVideoTracks();
            for (var i = 0; i !== videoTracks.length; ++i) {
                videoTracks[i].stop();
            }
        }
    }

    private start() {
        var self = this;
        ...
        this.stopLocalTracks();
        ...
        navigator.mediaDevices.getUserMedia(this.getConstrains())
            .then((stream) => {
                self.gotStream(stream);
                trace('Send signal to peers that I am ready to be called: onReadyForTeamspeak');
                self.SignalingChannel.send(JSON.stringify({type: 'onReadyForTeamspeak'}));
            })
            .catch( self.errorHandler );
    }

    public addPeerId(peerId){
        this.availablePeerIds[peerId] = peerId;
        this.preparePeerConnection(peerId);
    }

    private preparePeerConnection(peerId){
        var self = this;

        if( this.peerConns[peerId] ){
            return;
        }

        this.peerConns[peerId] = new RTCPeerConnection(this.serversCfg);
        this.peerConns[peerId].ontrack = function (evt) { self.gotRemoteStream(evt, peerId); };
        this.peerConns[peerId].onicecandidate = function (evt) { self.iceCallback(evt, peerId); };

        this.addTracks(peerId);
    }

    private addTracks(peerId){
        var self = this;

        var localTracksCount = 0;
        window.localStream.getTracks().forEach(
            function (track) {
                self.peerConns[peerId].addTrack(
                    track,
                    window.localStream
                );
            }
        );
    }

    private call() {
        var self = this;

        for( let peerId in this.availablePeerIds ){
            if( !this.availablePeerIds.hasOwnProperty(peerId) ){
                continue;
            }
            if( this.isCaller(peerId) ) {
                this.preparePeerConnection(peerId);
                this.createOffer(peerId);
            }
        }
    }

    private createOffer(peerId){
        var self = this;

        this.peerConns[peerId].createOffer( this.offerOptions )
            .then( function (offer) { return self.peerConns[peerId].setLocalDescription(offer); } )
            .then( function () {
                self.SignalingChannel.send(JSON.stringify({ "sdp": self.peerConns[peerId].localDescription, "remotePeerId": peerId, "type": "onWebRTCPeerConn" }));
            })
            .catch( this.errorHandler );
    }

    private answerCall(peerId){
        var self = this;

        this.peerConns[peerId].createAnswer()
            .then( function (answer) { return self.peerConns[peerId].setLocalDescription(answer); } )
            .then( function () {
                self.SignalingChannel.send(JSON.stringify({ "sdp": self.peerConns[peerId].localDescription, "remotePeerId": peerId, "type": "onWebRTCPeerConn" }));
            })
            .catch( this.errorHandler );
    }

    ...

    private gotRemoteStream(e, peerId) {
        if (!this.videoBillboards[peerId]) {
            this.createMediaElements(peerId);
        }
        if (this.videoAssets[peerId].srcObject !== e.streams[0]) {
            this.videoAssets[peerId].srcObject = e.streams[0];
        }
    }

    private iceCallback(event, peerId) {
        this.SignalingChannel.send(JSON.stringify({ "candidate": event.candidate, "remotePeerId": peerId, "type": "onWebRTCPeerConn" }));
    }

    private handleCandidate(candidate, peerId) {
        this.peerConns[peerId].addIceCandidate(candidate)
            .then(
                this.onAddIceCandidateSuccess,
                this.onAddIceCandidateError
            );
    }

    ...

    private handleSignals(signal){
        var self = this,
            peerId = signal.connectionId;

        this.addPeerId(peerId);

        if( signal.sdp ) {
            var desc = new RTCSessionDescription(signal.sdp);

            this.peerConns[peerId].setRemoteDescription(desc)
                .then(function () {
                    if (desc.type === 'offer') {
                        self.answerCall(peerId);
                    }
                })
                .catch( this.errorHandler );
        } else if( signal.candidate ){
            this.handleCandidate(new RTCIceCandidate(signal.candidate), peerId);
        } else if( signal.closeConn ){
            this.endCall(peerId,true);
        }
    }
}

2 ответа

Решение

Нашел решение! Что-то не так с опциями, которые я вставил в this.peerConns[peerId].createOffer( this.offerOptions ),

На самом деле в приведенном мною коде его не было видно, но метод, который динамически создавал мою переменную-член класса this.offerOptions была ошибка Это, очевидно, говорило вызываемому НЕ отправлять какие-либо потоки обратно вызывающему.

У меня есть система VideoCall, разработанная с помощью Ionic Cordova с PeerJS, она правильно работает на Android. Теперь, когда я развернулся на iOS из кордовы, всякий раз, когда я делаю второй вызов, он всегда выдает ошибку: PluginMediaStream с этим идентификатором «любой идентификатор» уже существует и больше не может присоединяться к вызовам, также события от peerjs не запускаются

Например:

peer.on('stream') вообще не запускается, я использовал этот плагин для обработки MediaStreams, но по некоторым причинам после первого видеозвонка он говорит, что MediaStream уже существует,

Как я могу инициировать некоторые события, если мне звонят одноранговые, onstream, onremove,

Я попытался удалить потоки, треки и другие вещи после завершения видеозвонка, но это не сработало.

Другие вопросы по тегам