Black Remote Stream and firefox shows CORS issue.

[sharik709]

Hi, Peerjs establish connection but when I call other peer. I get response with stream, ice and all. but when I try to show remote stream it is black nothing appear and firefox shows CORS issue.

EDITED:: Below method calls when user clicks on call candidate button

   callCandidate() {
      this.isIdle = false;
      this.isCalling = true;
      if(! this.callManager ) this.startVideoManager()
      this.callManager
              .call(this.interview.candidate.uuid, {
                caller: this.user, 
                type: 'interview', 
                interview: this.interview,
                audio: true,
                video: true
              })
                .then(callConnection => {
                  callConnection
                    .on('stream', remoteStream => {
                        this.$refs.videoStreaming.srcObject = remoteStream
                        this.$refs.videoStreaming.play()
                        this.callStarted()
                    })
                  let connection = this.callManager.getConnection();
                  connection
                    .on('error', err => {
                      if( err.message.includes('Could not connect to peer') ) {
                        alertUser('We will notify you when the candidate comes back online', 'Candidate Offline', 'error')
                        this.isIdle = true;
                        this.isCalling = false;
                      } else if( err.message.includes('Lost connection') ) {
                        alertUser('Lost connection to the server. Please check your internet conenction.', 'Lost Connecion', 'error')
                      }
                    })
                })
      return this;
    },

    call(remotePeerId, metadata = {})
    {
        let audioContext = new AudioContext();
        return new Promise((resolve, reject) => {
            audioContext.resume()
                .then(() => {
                    if( !metadata.audio && !metadata.video ) {
                        let connection = this.peerConnection.call(remotePeerId, (new MediaStream), {metadata:metadata});
                        return resolve(connection);
                    }
                    navigator.mediaDevices.getUserMedia({video: true, audio: true})
                        .then(
                            stream => {
                                let connection = this.peerConnection.call(remotePeerId, stream, {metadata:metadata})
                                resolve(connection)
                            }, err => {
                                console.error(err)
                                reject(err)
                            })
                })
        })
    }

            answerCall() {
                // this.hideRingPhone();
                // this.callManager.answerCall();
                let audioContext = new AudioContext();
                audioContext.resume()
                        .then(() => {
                            navigator.getUserMedia({audio: true, video: true}, stream => {
                                console.log(stream);
                                this.call.answer(stream);
                                if(! window.ghostConnection ) {
                                    window.eventBus.$emit('system-message', {
                                        sender: {
                                            name: 'RAJ',
                                            avatar: '/small-logo.png'
                                        },
                                        user: this.user,
                                        time: moment().format(),
                                        message: 'You are connected. Employer will begin text communication. Respond verbally'
                                    })
                                }
                                this.$refs.videoStreamer.srcObject = stream;
                            }, function(err) {
                                console.log('Failed to get local stream' ,err);
                                flash('Failed to get your audio/video source. Please check if your browser is compatible with WEBRTC')
                            });
                            this.isInterviewActive = true;
                        })
            }

[kidandcat]

Could you post more info? for example those CORS errors, and code if possible.

[sharik709]

@kidandcat thank you for your reply. Issue is fixed somehow automatically. Is it possible that it doesn't work properly on slow speed. Because I see that sometime. It shows black screen and sometime it works correctly and I have added code above. Thank you.