Question

我正在尝试使用MediaStreamRecorder library实施Chrome desktopCapture API。一切都很完美，但视频质量如此模糊和糟糕。 1分钟的桌面捕获视频需要14MB。

下面是我的代码：

 var pending_request_id;

 chrome.runtime.onMessage.addListener(function(message, sender, sendResponse) {
 startRecording();
 sendResponse({"success": true});
  });

function getUserMediaError() {
console.log("getUserMedia() failed.");
}

function onAccessApproved(id) {
 if (!id) {
 console.log("Access rejected.");
 return;
 }
  navigator.webkitGetUserMedia({
     audio:false,
    video: { mandatory: { chromeMediaSource: "desktop",
                        chromeMediaSourceId: id } }
  }, onMediaSuccess, getUserMediaError);
}

function startRecording()  {
pending_request_id = chrome.desktopCapture.chooseDesktopMedia(
   ["window"], onAccessApproved);
}



function onMediaSuccess(stream) {
 console.log("rcvd stream");
 var mediaRecorder = new MediaStreamRecorder(stream);
 mediaRecorder.mimeType = 'video/mp4';

 //i dont want strechy video so i fixed the width and height of recorder equal to window
mediaRecorder.width = window.screen.width; 
mediaRecorder.height = window.screen.height;

mediaRecorder.ondataavailable = function (blob) {

    var blobURL = URL.createObjectURL(blob);
    console.log('<a href="' + blobURL + '">' + blobURL + '</a>');


    var link=blobURL;
var videoInfo="Compiled Video file size: " + Math.ceil(blob.size / 1024) + "KB";

console.log(link);
console.log(videoInfo);

};
mediaRecorder.start(30000); // i want unlimited recording time so i increased the timeslice
  stream.onended = function() {
      mediaRecorder.stop();
  //finalizeVideo();
  console.log("Ended"); };
   }


function onMediaError(e) {
console.error('media error', e);
}

在使用此库之前，我尝试使用Whammy.js保存流式视频。但我没有这样做。然后我找到了这个库。

问题：

有没有办法提高视频质量以及压缩视频尺寸？

如何将以 blob：chrome url形式返回的视频保存为桌面的完全限定视频？

作为替代方案，如果有人知道如何在Whammy.js中执行此操作，请告知我

谢谢，

Answer 1

这可能有助于提高您的视频质量 -

navigator.webkitGetUserMedia({
    audio:false,
    video: { mandatory: { chromeMediaSource: "desktop",
                          chromeMediaSourceId: id,
                          maxWidth: 4000,
                          maxHeight: 4000 } }
  }, onMediaSuccess, getUserMediaError);
}

使用MediaStreamRecorder库的Chrome desktopCapture API

1 个答案: