浏览器调用摄像头getUserMedia

浏览器调用摄像头getUserMedia

2018年启动QQ浏览器会启动摄像头的新闻闹得沸沸扬扬。
前段时间公司让研究一下这个浏览器启用摄像头的功能，希望能够实现浏览器网页扫描二维码的功能。现在写下来记录一下。
浏览器启用摄像头是使用getUserMedia这个api实现的，调用后会提示用户给予使用媒体输入的许可，媒体输入会产生一个MediaStream，里面包含了请求的媒体类型的轨道。。此流可以包含一个视频轨道（来自硬件或者虚拟视频源，比如相机、视频采集设备和屏幕共享服务等等）、一个音频轨道（同样来自硬件或虚拟音频源，比如麦克风、A/D转换器等等），也可能是其它轨道类型。
有了这个api,使浏览器调用摄像头成为可能。但兼容性较差

自己测试华为自带浏览器，以及安卓微信浏览器测试通过。图上说支持的UC在12.0.8.988版本测试过发现支持这个getUserMedia方法，也成功回调了却不能成像，而小米自带浏览器测试发现不能打开摄像，应该是小米自带浏览器有安全性检测，浏览器不允许调用摄像头。
废话不多说，上代码：
html

<select id="select"></select>
<input type="button" title="开启摄像头" value="开启摄像头" "get