获取远程视频的黑屏:WebRTC

时间:2017-11-24 09:18:05

标签: javascript video-streaming webrtc freeswitch mod-verto

我正在使用WebRTC开发视频通话功能,并面临一个非常奇怪的问题。

当我拨打电话时,一切都很好,我正在收到远程视频流,但是当我接到电话时,我会看到一个没有远程视频的黑屏。奇怪的是,当我刷新页面时,我得到远程视频!

在控制台中,我得到以下内容:

视频约束错误

但是当我刷新页面时,我得到了视频对象。

这是 index.html

中的视频容器
<video id="video-container" autoplay="autoplay" class="video-style"></video>

Main.js:

(function() {
var vertoHandle, vertoCallbacks, currentCall;

document.getElementById("make-call").addEventListener("click", makeCall);
document.getElementById("hang-up-call").addEventListener("click", hangupCall);
document.getElementById("answer-call").addEventListener("click", answerCall);

$.verto.init({}, bootstrap);

function bootstrap(status) {
    vertoHandle = new jQuery.verto({
        // ID of HTML video tag where the video feed is placed.
        tag: "video-container",
        deviceParams: {
          // Asking for camera permissions and devices.
          useCamera: 'any',
          useMic: 'any',
          useSpeak: 'any',
        },

        login: '1008@127.0.0.1',
        passwd: '1234',
        socketUrl: 'wss://127.0.0.1:8082',
        ringFile: '',
        iceServers: true,
    }, vertoCallbacks);
};

vertoCallbacks = {
    onWSLogin : onWSLogin,
    onWSClose : onWSClose,
    onDialogState: onDialogState,
}

function onWSLogin(verto, success) {
    console.log('onWSLogin', success);
}

function onWSClose(verto, success) {
    console.log('onWSClose', success);
}

function onDialogState(d) {
    console.debug('onDialogState', d);

    if(!currentCall) {
        currentCall = d;
    }

    switch (d.state.name) {
        case 'trying':
            //
            break;
        case 'ringing':
            alert('Someone is calling you, answer!');
            break;
        case 'answering':
            //
            break;
        case 'active':
            //
            break;
        case 'hangup':
            //
            break;
        case 'destroy':
            //
            break;
    }
}

function makeCall() {
    vertoHandle.videoParams({
        minWidth: 320,
        minHeight: 240,
        maxWidth: 640,
        maxHeight: 480,
        // The minimum frame rate of the client camera, Verto will fail if it's
        // less than this.
        minFrameRate: 15,
        // The maximum frame rate to send from the camera.
        vertoBestFrameRate: 30,
    });

    currentCall = vertoHandle.newCall({
        useVideo: true,
        mirrorInput: true,

        destination_number : '3520',
        caller_id_name : 'Test Caller',
        caller_id_number: '1008',
        outGoingBandwidth: 'default',
        inComingBandwidth: 'default',

        useStereo: true,
        useMic: true,
        useSpeak: true,

        userVariables: {
            email: 'test@test.com'
        },

        dedEnc: false,
    });
}

function hangupCall() {
    currentCall.hangup();
};

function answerCall() {
    currentCall.answer();
}
})();

这段代码出了什么问题?

提前致谢!

1 个答案:

答案 0 :(得分:2)

经过一些研究,我找到了解决方案。

我收到错误Video constraints false,因为它们是在拨打电话时设置的,而不是在接收时设置的。所以我手动设置属性,

useVideo: true

deviceParams

现在,我在拨打电话时也收到了视频。