HTML5调用摄像头和麦克风Demo

时间:2025-02-15 07:13:18
<!DOCTYPE html> <html> <head> <meta charset="utf8"/> <title>打开摄像头测试</title> </head> <body> <h1>摄像头测试<h1> <div id="app"> <video autoplay controls id="video"></video> </div> <button id="cameraBtn">打开摄像头测试</button> </body> </html> <script type="text/javascript"> document.querySelector('#cameraBtn').onclick = function() { let constraints ={ audio: true, video: true }; navigator.mediaDevices.getUserMedia(constraints).then(function(stream) { document.querySelector('#video').srcObject = stream }).catch(function(err) { console.log(err.name+":"+err.message); }); } </script>