JS实现网页二维码扫描功能

阿诺伯格

于 2022-06-01 10:53:28 发布

阅读量5.9k

点赞数 9

文章标签： html javascript 前端

本文链接：https://blog.youkuaiyun.com/qq_39075676/article/details/125069013

版权

本文分享了如何使用JS在网页上实现二维码扫描功能。详细介绍了所需的HTML、JS文件及运行步骤，包括文件下载、打包、上传、解压和在移动端浏览器中打开以启用摄像头扫描二维码。适合前端开发者参考。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

JS实现网页二维码扫描功能

最近接到一个任务，实现网页版的二维码扫描，刚开始以为会很简单，没想到大意失荆州，网上的教程资料很多，可是可以用的不多，所幸我最终做了出来，所以分享给大家，大家一起进步。

代码

HTML部分代码

<html>
	<head>
        <meta charset="utf-8" />
		<title>Scanner</title>
        <script src="jquery.min.js"></script>
        <script src="jsQR.js"></script>
	</head>
	<body>
		<canvas id="qr-canvas" width="800" height="600"></canvas>
		<video id="v" autoplay></video>
		<script type="text/javascript" src="qrcode.js"></script>
		<script type="text/javascript" src="scan.js"></script>
	</body>
</html>