🔥码云GVP开源项目 12k star Uniapp+ElementUI 功能强大 支持多语言、二开方便! 广告
[TOC] ## 核心函数 ``` navigator.mediaDevices.getUserMedia ``` ## 代码示例 client.js ``` 'use strict' var vidoeplay = document.querySelector('video#player'); function gotMediaStream(stream) { vidoeplay.srcObject = stream; } function handleGetMediaError(err) { console.log('getUserMedia error:', err); } if (!navigator.mediaDevices || !navigator.mediaDevices.getUserMedia) { console.log("getUserMedia is not support"); } else{ var constraints = { video: true, audio: false } navigator.mediaDevices.getUserMedia(constraints) .then(gotMediaStream) .catch(handleGetMediaError); } ``` index.html ``` <html> <head> <title>WebRtc capture video and audio</title> </head> <body> <video autoplay playsinline id="player"></video> <script src="./js/client.js"></script> </body> </html> ``` ## 适配不同浏览器的方法 自己实现 ``` var getUserMedia = navigator.getUserMedia|| navigator.webkitGetUserMedia|| navigator.mozGetUserMedia; ``` 使用Google开源库adapter.js ``` https://webrtc.github.io/adapter/adapter-latest.js ```