小程序
小游戏
企业微信
微信支付
扫描小程序码分享
网页中使用navigator.mediaDevices.getUserMedia接口调用摄像头，在安卓端可以正常使用，safari浏览器也可以使用，但是使用小程序webview加载网页之后没法调用摄像头。我需要在摄像机画面前面展示3D模型， 而input type=file是调用手机自身相机，会覆盖掉小程序内容。
4 个回答
加粗
标红
插入代码
插入链接
插入图片
上传视频
你好，
麻烦提供出现问题的具体机型、微信版本号、系统版本号，以及能复现问题的代码片段（https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html）
你好，麻烦通过点击下方“反馈信息”按钮，提供出现问题的。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>NFT marker example with a WebWorker and Three.js</title>
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=0.5, maximum-scale=1">
<link rel="stylesheet" href="css/nft-style.css">
</head>
<body>
<div id="app">
<video
loop
autoplay
muted
playsinline
id="video">
</video>
<canvas id="canvas"></canvas>
</div>
<script>
var video = document.getElementById( 'video' );
var canvas = document.getElementById( 'canvas' );
console.log(navigator);
if (navigator.mediaDevices && navigator.mediaDevices.getUserMedia) {
var hint = { audio: false, video: true };
if( window.innerWidth < 800 ) { // 宽高比为2/3或者3/2
var width = ( window.innerWidth < window.innerHeight ) ? 240 : 360;
var height = ( window.innerWidth < window.innerHeight ) ? 360 : 240;
width = width * window.devicePixelRatio;
height = height * window.devicePixelRatio;
hint = {
audio: false,
video: {
facingMode: 'environment',// 调用后置摄像头
width: { min: width, max: width }
},
};
}
navigator.mediaDevices.getUserMedia( hint ).then( function( stream ) {
console.log('then')
video.srcObject = stream;
video.addEventListener( 'loadedmetadata', function() {
video.play();
} );
} ).catch(err => {
console.log('catch');
});
现在还是不好使，有解决办法了吗
有没有好的解决办法，愁死人了
请问解决了吗。现在能在小程序中使用navigator.mediaDevices.getUserMedia 获取camera摄像头画面了吗
关注后，可在微信内接收相应的重要提醒。
请使用微信扫描二维码关注 “微信开放社区” 公众号
你好，
麻烦提供出现问题的具体机型、微信版本号、系统版本号，以及能复现问题的代码片段（https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html）
<!DOCTYPE html><html><head><meta charset="utf-8"><title>NFT marker example with a WebWorker and Three.js</title><meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=0.5, maximum-scale=1"><link rel="stylesheet" href="css/nft-style.css"></head><body><div id="app"><videoloopautoplaymutedplaysinlineid="video"></video><canvas id="canvas"></canvas></div><script>var video = document.getElementById( 'video' );var canvas = document.getElementById( 'canvas' );console.log(navigator);if (navigator.mediaDevices && navigator.mediaDevices.getUserMedia) {var hint = { audio: false, video: true };if( window.innerWidth < 800 ) { // 宽高比为2/3或者3/2var width = ( window.innerWidth < window.innerHeight ) ? 240 : 360;var height = ( window.innerWidth < window.innerHeight ) ? 360 : 240;width = width * window.devicePixelRatio;var video = document.getElementById( 'video' );var canvas = document.getElementById( 'canvas' );console.log(navigator);if (navigator.mediaDevices && navigator.mediaDevices.getUserMedia) {var hint = { audio: false, video: true };if( window.innerWidth < 800 ) { // 宽高比为2/3或者3/2var width = ( window.innerWidth < window.innerHeight ) ? 240 : 360;var height = ( window.innerWidth < window.innerHeight ) ? 360 : 240;width = width * window.devicePixelRatio;height = height * window.devicePixelRatio;hint = {audio: false,video: {facingMode: 'environment',// 调用后置摄像头width: { min: width, max: width }},};}navigator.mediaDevices.getUserMedia( hint ).then( function( stream ) {console.log('then')video.srcObject = stream;video.addEventListener( 'loadedmetadata', function() {video.play();} );} ).catch(err => {console.log('catch');});}现在还是不好使，有解决办法了吗
有没有好的解决办法，愁死人了