quaggaJS 识别条形码

最新推荐文章于 2024-04-24 16:59:09 发布

原创

最新推荐文章于 2024-04-24 16:59:09 发布 · 8.4k 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#quaggaJS

本文介绍了如何利用quaggaJS库在网页上实现实时条形码识别功能。通过设置摄像头权限，调用quaggaJS的API，可以高效地捕获和解析条形码信息，为网页应用增加便捷的数据输入途径。

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

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>test</title>
    <script src="vconsole.min.js"></script>
    <script src="quagga.js"></script>
</head>
<body>
    <div id="canvanCode"></div>
    <script>
        Quagga.init({
            inputStream : {
                name : "Live",
                type : "LiveStream",
                target: document.querySelector('#canvanCode')    // Or '#yourElement' (optional)
            },
            decoder : {
                readers : ["ean_reader",'code_39_reader'],
                debug: {
                    drawBoundingBox: false,
                    showFrequency: false,
                    drawScanline: false,
                    showPattern: false
                },
                multiple: false
            }
        }, function(err) {
            if (err) {
                cons