尝试设置 canvas 宽度和视频宽度，但用 object object 回答

Question

我正在尝试修改我正在录制的视频和音频默认设置，但出于某种我不知道的原因，它不起作用。我开始记录的开始得到的是：

started recording audio stream.
sample-rate 48000
buffer-size 4096
started recording [Object Object] stream.
sample-rate 48000
buffer-size 4096

主要问题是 "started recording"，其中 return 是 [Object Object]。它应该 return 宽度和高度大小。看来我没有正确设置强制变量。

在下面粘贴我的代码：

var video = $('preview')[0],
    audio,
    fileName,
    replay,
    blob,
    timer,
    streaming,
    isFirefox = !!navigator.mozGetUserMedia,
    recordAudio,
    recordVideo,
    progress,
    upload_bar,
    seconds,
    video_constraints = { mandatory: { minWidth: 1280, minHeight: 720, minFrameRate: 30}, optional: [] };

//If getUserMedia is soported by our browser and we allow to use it, our video tag will show the stream we're recording.
function success(stream) {
    'use strict';

    video = $('#preview')[0];

    video.src = window.URL.createObjectURL(stream);

    video.play();

    video.muted = true;

    if (!isFirefox) {
        window.stream = stream;
    } else {
        audio = document.querySelector('audio');
        streaming = stream;
    }

    $('#start-camara').hide();
    $('#round-record').css('display', 'block');

    $('.record-actions').css('justify-content', 'center');

    setTimeout(function () {
        $('#preview').css('width', 'auto');
    }, 1255);

    $('#round-record > path').on('click', function () {
        if (!isFirefox) {
            $('#splitbar-pause').css('display', 'block');
        }

        if (!video.src) {
            window.alert("there must be an error with your video");
            return;
        } else {
            $('#square-stop').css('display', 'block');
            $('#round-record').css('display', 'none');
        }

        countdown();

        recordAudio = new RecordRTC(stream, {
            // bufferSize: 16384,
            onAudioProcessStarted: function () {
                if (!isFirefox) {
                    recordVideo.startRecording();
                }
            }
        });

        recordVideo = new RecordRTC(stream, {
            type: video_constraints
        });

        recordAudio.startRecording();
    });


}

// Sets a poster error when there's no posibility to load the camera
function error(e) {
    'use strict';

    if (!video.hasAttribute("poster")) {
        video.setAttribute("poster", "img/nocamera.png");
    }
}

// Check the webRTC library compatible with the browser
function checkCompatibility() {
    'use strict';

    return !!(navigator.getUserMedia ||
                 navigator.webkitGetUserMedia ||
                 navigator.mozGetUserMedia ||
                 navigator.msGetUserMedia);
}

function startCamera() {
    'use strict';

    if (!checkCompatibility()) {
        error();
    }

    if (!window.stream && navigator.getUserMedia) {
        navigator.getUserMedia({
            audio: true,
            video: video_constraints
        }, success, error);
    } else {
        error();
    }
}

有人可以帮我解决这个问题吗？

谢谢指教。

Answer 1

是的，如果您只想录制视频，recordRTC(stream, options) 的第二个参数应该是 {type: 'video'}。

这里你没有传递这个video参数，所以我认为它试图记录一个mandatory，这可能会失败。

录制视频的constrain the width/height，选项应该是这样的

var options = {
   type: 'video',  // Mandatory STRING
   video: {
      width: 320,
      height: 240
   },
   canvas: {
      width: 320,
      height: 240
   }
};

var recordVideo = RecordRTC(MediaStream, options);

您甚至可以设置 width/height：

var options = {
   type: 'video',     // Mandatory STRING
   width: 1920,
   height: 1280
};

var recordVideo = RecordRTC(MediaStream, options);

尝试设置 canvas 宽度和视频宽度，但用 object object 回答

Trying to set canvas width and video width but answer with object objetct

javascript

webrtc