浏览器打卡摄像头的兼容问题

原因:IE8及以下不支持HTML5标签:video和canvas;IE11及以下所有版本,包括Edge都不支持getUserMedia()。 

想要兼容IE浏览器就只能使用Flash。

解决方案
方案一
flash+as3.0+swfobject实现摄像头拍照
方案分析:
1、使用 adobe flash + actionscript 制作swf文件;
2、采用swfobject.js插件实现页面调用swf文件。
有一篇博客写得特别好:flash+as3.0+swfobject实现摄像头拍照

这样可以自定义swf文件,,还要去学actionscript并且要装adobe flash CS6,。

所以我想到既然有封装的swfobject插件可以更方便的插入flash。jQuery摄像头插件“jquery-webcam-plugin”。

方案二
jquery-webcam-plugin+canvas+后台处理
方案分析:

使用 jquery-webcam-plugin 显示本地摄像头。
点击拍照按钮后,
(a) 针对 IE9 及以上:通过flash调用摄像头后,将图像直接输出到canvas画布中,再通过canvas中的方法 toDataURL()方法,生成图像的base64编码传到后台。
(b)针对 IE8 及以下:因为 IE8 无法用canvas.toDataURL() ,因此拍照后无法直接将图片进行显示。这时通过flash调用摄像头,将得到的像素点阵传到后台,让后台处理,生成图像的 base64 编码,再在前端进行显示。

猜你喜欢

转载自www.cnblogs.com/ziyandeyanhuo/p/11004763.html