html5扫二维码,html5调用手机摄像头扫描二维码

用HTML5 可以实现二维码扫描识别的功能吗

可以。

实现基本步骤：

操作摄像头，获取图片。

技术要点：MediaStream、GetUserMedia、File api。

利用canvas使用相关算法分析图片识别图片得出结果。

技术要点：getImageData

* 涉及到的技术点浏览器们（包括移动端）支持各异，现阶段要开发并投产还不太现实

* 识别算法是一个难点，不过谢谢github，谢谢开源社区，@Shou Jiesong 的答案中有phonegap的插件地址，支持各种码。

相关问答

Q1: html5怎么做扫描二维码的功能

1.解决的问题：

1.能够在微博客户端呼起摄像头扫描二维码并且解析;

2.能够在原生浏览器和微信客户端中扫描二维码并且解析;

2.优点：

web端或者是 h5端可以直接完成扫码的工作；

3.缺点：

图片不清晰很容易解析失败(拍照扫描图片需要镜头离二维码的距离很近)，相对于 native 呼起的摄像头解析会有1-2秒的延时。

说明：

此插件需要配合zepto.js 或者 jQuery.js使用

使用方法：

1.在需要使用的页面按照下面顺序引入lib目录下的 js 文件

复制代码

代码如下:

script src="lib/zepto.js"/script

script src="lib/qrcode.lib.min.js"/script

script src="lib/qrcode.js"/script

Q2: html5怎么扫描二维码

扫描二维码的话，取决于手机摄像头。

Html5文件的话，你需要将制作好的二维码图片放在Html5内容里面。

将建好的网址加在微信公众号，或者是QQ公众的导航上面，或者是网站里面。

当点击进入页面之后，会看到二维码图片。

用手机按压图片，APP会提示扫描图片中的二维码？

点击确定扫描二维码即可。

注释：图片尽量做成像下图一样的，增强二维码的趣味性，吸引其他人扫描。