Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/html/73.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
使用getuserMedia()Javascript拍摄的分辨率错误的图像_Javascript_Html_Camera_Getusermedia - Fatal编程技术网

使用getuserMedia()Javascript拍摄的分辨率错误的图像

使用getuserMedia()Javascript拍摄的分辨率错误的图像,javascript,html,camera,getusermedia,Javascript,Html,Camera,Getusermedia,我想用javascript getUserMedia函数从手机摄像头上截图,但分辨率很差 if (navigator.mediaDevices) { // access the web cam navigator.mediaDevices.getUserMedia({ video: { width: { min: 1280, }, height: { min: 720, }, facingMode: { exa

我想用javascript getUserMedia函数从手机摄像头上截图,但分辨率很差

if (navigator.mediaDevices) {
  // access the web cam
  navigator.mediaDevices.getUserMedia({
   video: {
    width: { 
     min: 1280,
    },
    height: {
     min: 720,
    },
    facingMode: {
     exact: 'environment'
    }
   }
  }).then(function(stream) {
      video.srcObject = stream;
      video.addEventListener('click', takeSnapshot);
  })
  .catch(function(error) {
      document.body.textContent = 'Could not access the camera. Error: ' + error.name;
  });
}


var video = document.querySelector('video'), canvas;

function takeSnapshot(){
  var img =  document.createElement('img');
  var context;
  var width = video.offsetWidth, height = video.offsetHeight;
  var canvas = document.createElement('canvas');
    canvas.width = width;
    canvas.height = height; 
    context = canvas.getContext('2d');          
    context.webkitImageSmoothingEnabled = false;
    context.mozImageSmoothingEnabled = false;
    context.imageSmoothingEnabled = false;
    context.drawImage(video, 0,  0, width,  height);    
    img.src = canvas.toDataURL('image/jpeg');
}
代码没有错误,但分辨率不好,我看不懂图片的文字。
有一种方法可以从照相机获得真实的图像质量?

MediaCapture

这就是您通过getUserMedia使用的内容

如果您的相机仅允许1920x1080、1280x720和640x480分辨率,则媒体捕获的浏览器实现可以模拟1280x720的480x640馈送(请参阅)。通过测试(主要是Chrome),浏览器通常会将720缩小到640,然后裁剪中心。有时,当我使用虚拟相机软件时,我看到Chrome在不受支持的分辨率周围添加了人工黑色填充。客户看到的是成功的信息和正确维度的提要,但一个人会看到质量下降。由于这种模拟,您无法保证提要正确或未缩放。但是,它通常具有要求的正确尺寸

您可以阅读有关约束的内容。它基本上归结为:给我一个接近x的分辨率。然后浏览器通过自己的实现决定拒绝约束并抛出错误、获得分辨率或模拟分辨率

有关此设计的更多信息,请参阅mediacapture规范。特别是:

RTCPeerConnection是一个有趣的对象,因为它起作用 同时作为网络上的接收器和源 溪流。作为接收器,它具有源转换能力(例如。, 降低比特率、放大/缩小分辨率和调整 帧速率),并且作为源,它可以更改自己的设置 通过跟踪源

其主要原因是允许n个客户端访问相同的媒体源,但可能需要不同的分辨率、比特率等,因此模拟/缩放/转换尝试解决此问题。消极的一面是,你永远不知道源分辨率是什么

图像捕获

这可能是您的解决方案

如果60FPS的视频不是一个硬性要求,并且您拥有leway on兼容性,那么您可以投票模拟摄像头,并从摄像头接收更清晰的图像

您必须检查客户端支持,然后可能会退回到MediaCapture

API支持对相机功能的控制,如变焦、亮度、对比度、ISO和白平衡。最重要的是,图像捕获允许您访问任何可用设备摄像头或网络摄像头的全分辨率功能。以前的网上拍照技术都使用视频快照(MediaCapture渲染到画布上),其分辨率低于静止图像

以及其多填料:


检查分辨率是否不是
1280
x
720