WebRTC视频聊天在FF中运行,但在Chrome中不起作用

时间:2016-05-18 06:24:00

标签: javascript google-chrome webrtc

早在1997年,一页在IE浏览器中看起来不错,但同样的页面在Netscape中看起来会破碎。我觉得我在2016年会和WebRTC一起经历同样的事情。我创建了一个聋人社交媒体。现在他们可以聊天和发帖子了。我想添加视频会议,其中每个邮政编码和每个城市/州都有一个“房间”。这是其中一个房间的公共链接(邮政编码)。

https://ikasl.azurewebsites.net/m/vface.aspx?area=94519

所以我们把一些在FF中完美运作的东西放在一起。但它在我的Chrome中不起作用。我得到的是一个黑盒子。浏览器日志(控制台)很清楚。没有错误。有没有人看到这个代码有什么问题,只能在FF中工作?感谢

            var openVideoChat = function () {
            if (chatIsOpened) { return false; };
            var connection = new RTCMultiConnection();
            connection.socketURL = herokuURL;
            connection.socketMessageEvent = 'video-conference-demo';
            connection.session = { audio: true, video: true };
            connection.sdpConstraints.mandatory = { OfferToReceiveAudio: true, OfferToReceiveVideo: true };
            connection.videosContainer = document.getElementById('videos-container');
            connection.onstream = function(event) {
                var width = parseInt(connection.videosContainer.clientWidth / 2) - 20;
                var mediaElement = getMediaElement(event.mediaElement, {
                    title: event.userid,
                    buttons: [
                        'full-screen',
                        'mute-audio',
                        'mute-video',
                        'stop',
                        'stop-others'
                    ],
                    width: width,
                    showOnMouseEnter: true
                });
                connection.videosContainer.appendChild(mediaElement);

                setTimeout(function() { mediaElement.media.play(); }, 5000);
                mediaElement.id = event.streamid;
            };
            connection.onstreamended = function(event) {
                var mediaElement = document.getElementById(event.streamid);
                if(mediaElement) { mediaElement.parentNode.removeChild(mediaElement); }
            };
            connection.openOrJoin(roomid);
            chatIsOpened = true;

            var bitrates = {
                audio: connection.bandwidth.audio,
                screen: connection.bandwidth.screen,
                video: connection.bandwidth.video,
            };

            var bitrateIndicatorEl = document.getElementById('bitrateIndicator');
            bitrateIndicatorEl.innerHTML = ('Bitrates: [audio: <b>' + bitrates.audio
                + ' kbps</b>] [your: <b>' + bitrates.screen
                + ' kbps</b>] [others: <b>' + bitrates.video + ' kbps</b>]');
        };

        var modal = new tingle.modal({
            footer: true,
            stickyFooter: false,
            onOpen: function () { },
            onClose: function () { }
        });
        modal.setContent('<div id="videos-container"</div><div id="bitrateIndicator"></div>');
        modal.addFooterBtn('Close popup', 'tingle-btn tingle-btn--primary', function () {
            modal.close();
        });

1 个答案:

答案 0 :(得分:0)

这条线对我来说很奇怪:

setTimeout(function() { mediaElement.media.play(); }, 5000);

您只需在媒体元素上设置autoplay: true即可自动播放。