razer
razer

Reputation: 134

AWS remote video not loading (viewer)

amazon-kinesis-video-streams-webrtc-sdk-js

video stream works on local (ie. viewer and master on same machine or browser with different tabs ) but when viewer and master is on different machine (ie. remote) it doesn't work

on remote view (only) event.currentTarget.connectionState status returns failed after 5 seconds. but restarting connection with peerConnection.restartIce() doesn't work at all

this is the viewer stream function where i set the srcObject to my video element.

can anyone tell me what is wrong with this code ?

    function openSignalingViewer(channelARN, channelEndpoint, configuration, onRemoteDataMessage) {
    const peerConnection = new RTCPeerConnection(configuration);
    peerConnection.ondatachannel = event => {
        event.channel.onmessage = onRemoteDataMessage
    }
    dataChannels['proctor'] = peerConnection.createDataChannel('kvsDataChannel')

    const signalingClient = new SignalingClient({
        ...config,
        channelARN,
        channelEndpoint,
        clientId: getRandomClientId(),
        role: ChannelRole.VIEWER
    })

    signalingClient.on('open', async () => {
        // Create an SDP offer to send to the master
        await peerConnection.setLocalDescription(
            await peerConnection.createOffer({
                offerToReceiveAudio: true,
                offerToReceiveVideo: true,
            }),
        );
        signalingClient.sendSdpOffer(peerConnection.localDescription);
    });
    signalingClient.on('sdpAnswer', async answer => {
        // Add the SDP answer to the peer connection
        await peerConnection.setRemoteDescription(answer);
    });

    signalingClient.on('iceCandidate', async (candidate, remoteClientId) => {
        await peerConnection.addIceCandidate(candidate)
    })

    peerConnection.addEventListener('track', event => {
        config.remoteView.srcObject = event.streams[0];
    });
    peerConnection.addEventListener('connectionstatechange', event => {
        if (event.currentTarget.connectionState === 'failed') {
            console.log('restarting')
            peerConnection.restartIce()
        }
    });
    signalingClient.on('error', error => {
        console.log('error', error)
    })
    signalingClient.open()
    return signalingClient
     }

Upvotes: 0

Views: 150

Answers (1)

razer
razer

Reputation: 134

function openSignalingViewer(channelARN, channelEndpoint, configuration,     onRemoteDataMessage) {
const peerConnection = new RTCPeerConnection(configuration);
peerConnection.ondatachannel = event => {
    event.channel.onmessage = onRemoteDataMessage
}
dataChannels['proctor'] = peerConnection.createDataChannel('kvsDataChannel')

const signalingClient = new SignalingClient({
    ...config,
    channelARN,
    channelEndpoint,
    clientId: getRandomClientId(),
    role: ChannelRole.VIEWER
})

signalingClient.on('open', async () => {
    // Create an SDP offer to send to the master
    await peerConnection.setLocalDescription(
        await peerConnection.createOffer({
            offerToReceiveAudio: true,
            offerToReceiveVideo: true,
        }),
    );
    signalingClient.sendSdpOffer(peerConnection.localDescription);
});
signalingClient.on('sdpAnswer', async answer => {
    // Add the SDP answer to the peer connection
    await peerConnection.setRemoteDescription(answer);
});

signalingClient.on('iceCandidate', async (candidate, remoteClientId) => {
    await peerConnection.addIceCandidate(candidate)
})

//the missing code
peerConnection.addEventListener('icecandidate', ({ candidate }) => {
  if (candidate) {
    signalingClient.sendIceCandidate(candidate);
  } else {
    // No more ICE candidates will be generated
  }
});

peerConnection.addEventListener('track', event => {
    config.remoteView.srcObject = event.streams[0];
});
peerConnection.addEventListener('connectionstatechange', event => {
    if (event.currentTarget.connectionState === 'failed') {
        console.log('restarting')
        peerConnection.restartIce()
    }
});
signalingClient.on('error', error => {
    console.log('error', error)
})
signalingClient.open()
return signalingClient
 }

finally figured it out !! was missing this event listener to sendIceCandidate.

peerConnection.addEventListener('icecandidate', ({ candidate }) => {
  if (candidate) {
    signalingClient.sendIceCandidate(candidate);
  } else {
    // No more ICE candidates will be generated
  }
});

Upvotes: 0

Related Questions