1.获取本地媒体
'use strict'; const constraints = window.constraints = { audio: false, video: true }; function handleSuccess(stream) { const video = document.querySelector('video'); window.stream = stream; video.srcObject = stream; } function handleError(error) { console.log("error") } async function init(e) { try { const stream = await navigator.mediaDevices.getUserMedia(constraints); handleSuccess(stream); e.target.disabled = true; } catch (e) { handleError(e); } } document.querySelector('#showVideo').addEventListener('click', e => init(e));
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>webrtcdemo</title> </head> <body> <div> <h1>获取网络摄像头</h1> <video autoplay playsinline></video> <button id="showVideo">Open camera</button> </div> <script src="./js/main.js"></script> </body> </html>
测试：
