WebRTC streams freeze after first frame

Question

Here's the deal, I've got a WebRTC 1 on 1 conversation using:

Everything seems to work fine, but there is one problem:

Chrom* browsers display only first frame of the video and then the video freezes, as well as audio. Looking at the Chromium process network and CPU usage, it's getting and decoding video, but not showing it. Here are my codes:

window.webrtc = new SimpleWebRTC({
    localVideoEl: 'local',
    remoteVideosEl: 'remote',
    autoRequestMedia: true,
    debug: true,
    url: 'https://server.server:8888/'
});

window.webrtc.on('videoAdded', function (video, peer) {
    var remotes = document.getElementById('remote');
    if (remotes) {
        var container = document.createElement('div');
        container.className = 'videoContainer';
        container.id = 'container_' + webrtc.getDomId(peer);
        container.appendChild(video);

        video.oncontextmenu = function () {
            return false;
        };

        remotes.appendChild(container);

        if (peer) {
            peer.on('iceConnectionStateChange', function (event) {
                switch (peer.pc.iceConnectionState) {
                    case 'checking':
                        $('#status').text('Connecting...');
                        break;
                    case 'connected':
                    case 'completed': // on caller side
                        $('#status').text('Connected');
                        break;
                    case 'disconnected':
                        $('#status').text('Disconnected');
                        break;
                    case 'failed':
                        $('#status').text('Failed to connect');
                        break;
                    case 'closed':
                        $('#status').text('Connection closed');
                        $('#remote').empty();
                        break;
                }
            });
        }
    }
});

window.webrtc.on('readyToCall', $.ajax({
    url: '/getroom.php',
    success: function (data) {
        window.webrtc.joinRoom(data);
    }
}));

<p id="status">Waiting...</p>
<video id="local" width="300" height="225" autoplay></video>
<div id="remote"></div>

Signalmaster:

{
    "uid": "nobody",
    "isDev": true,
    "logLevel": 3,
    "server": {
            "port": 8888,
            "secure": true,
            "key": "key.key",
            "cert": "cer.cer"
    },
    "stunservers" : [
            {
                    "url": "stun:server.server:3478"
            }
    ],
    "turnservers" : [
            {
                    "url": "turn:server.server:3478",
                    "secret": "qgJeuJuIyeqX",
                    "expiry": 86400
            }
    ]
}

CoTurn server is configured to qgJeuJuIyeqX secret key and to server.server realm, everything else is default.

Apperently, videoAdded method was a problem, after removing it and letting SimpleWebRTC handle the video adds, it was fixed, but this isn't the proper answer to this problem. — John Smith, Feb 26 '15 at 16:54

score 2 · Accepted Answer · answered Apr 18 '15 at 16:58

Seems to be an issue in Chrome where re-appending video elements causes the video to freeze. The solution is to only add the video element once. I got around this by leaving the remoteVideosEl section blank:

window.webrtc = new SimpleWebRTC({
    localVideoEl: 'local',
    remoteVideosEl: '',
    autoRequestMedia: true,
    debug: true,
    url: 'https://server.server:8888/'
});

This way SimpleWebRTC does not automatically attach the video element for you, so when the 'videoAdded' method is called you can attach the video for the first time.

What is the equivalent of the 'remoteVideosEl' parameter if one is using just RTCPeerConnection and not SimpleWebRTC? It looks like SimpleWebRTC is a paid service. — Bruce Seymour, Jan 21 '22 at 15:47

score 0 · Answer 2 · edited May 23 '17 at 11:47

0

Another option is to call .play() for DOM element, so it will start video/audio transmit. To avoid exception in console, you can use this hotfix: How to prevent "The play() request was interrupted by a call to pause()" error?

edited May 23 '17 at 11:47

Community

1
1

answered May 11 '17 at 04:57

Stepan Yakovenko

8,670
28
113
206

WebRTC streams freeze after first frame

2 Answers2