解析二维码,二维码在线生成

前端H5如何实现调用摄像头扫描二维码并解析二维码?

解析二维码,二维码在线生成


在用户授权您使用摄像头的情况下,您是可以调用系统的摄像头的 。并且你可以通过canvas技术,将摄像头的内容画在你的网页里 。看上去就和微信的扫一扫差不多的样子 。当然使用这个必须有一个前提,那就是用户给你授权了,否则的情况下你是调用不到系统的摄像头的 。当你能够调用到系统的摄像头,并且拍摄到了二维码的图视频文件之后,那么你可以将这段视频传给后端,由后端来给你解析其中的二维码 。
您如果希望前端自行来解析这个视频的话,我相信会非常非常的困难 。至少我当下没有任何的思路 。此外我并不推荐这个功能由前端去实现,因为它涉及到的问题非常的多,如果是客户端自己实现的话,就完全没有必要将视频进行上传 。所以既然是一个web APP的设计,一定是镶嵌在你们自己的APP里面的,那么你们可以通过APP来实现这个功能,然后在你们的h5页面当中调用这个系统功能就可以了 。
大家都熟知二维码,那么字符串是怎么转换成二维码的呢?原理是啥?
【解析二维码,二维码在线生成】
解析二维码,二维码在线生成


移动互联网时代,二维码在我们身边可以随处可见,手机支付有付款码,公交地铁有乘车码,还有最近出现的健康码 。其实不管是付款码还是乘车码,本质上它们都是二维码,那么二维码到底是什么呢?二维码是什么?回想一下我们在超市买东西时结账的流程:首先我们打开付款码,接着收营员扫我们的付款码,然后钱就自动从我们的账户中扣除了 。
可以看出,扫码付款的过程就是从二维码到人的一个过程,从二维码所代表的信息中找到我们的账户信息并从中扣款 。那么二维码所代表的信息是什么时候确定的?当然是生成二维码的时候啦!我们要使用手机支付功能,首先必须注册帐号,此时帐号就代表了我们 。打开付款码的时候,系统会将我们的身份信息经过一些计算,最终生成一个二维码并展示给我们 。
生成二维码的过程就是将信息转换成二维码的过程,扫码的过程则是将二维码再转换成信息的过程,所以二维码本质上只是信息的一种展示形式而已 。二维码结构分析虽然二维码看起来是毫无规律的,但其实二维码的生成有着固定的格式 。大小二维码的大小存在 40 种版本(Version),从Version1(21x21的正方形)到Version40(177x177的正方形),每增加一个 Version,大小都会增加 4 。
版本越大二维码就会越大,随之所能表示的数据量也就越大 。结构二维码呈正方形,通常由黑白小方块组成,二维码的整体结构可以分为定位标记、功能区以及数据区三大部分:定位标记——在二维码的左上角、右上角、左下角有3个类似“回”字的方形图案,这3个图案是用于二维码的定位标记 。正因为有定位标记的存在,所以不管我们以什么角度扫描,二维码总是可以被准确的识别出来 。
二维码中还存在一些小一点“回”字,它们是用于校正定位的标记,并且只会在Version 2及以上版本的二维码中才会出现 。功能区——功能区分为两部分,即图中红色部分和紫色部分 。红色部分存放格式信息,用于表示该二维码的纠错级别(至于纠错级别是什么后面在解释),紫色部分存放版本信息,即该二维码的尺寸大小 。数据区——数据区指的是除去定位标记和功能区的其他部分(图中灰色部分),用于保存二维码实际所表示的信息的数据码以及用于纠错的纠错码 。

推荐阅读