【问题标题】:pdf417 Javascript Reading / Decodingpdf417 Javascript 读取/解码
【发布时间】:2014-12-31 21:13:19
【问题描述】:

我的任务是为基于 Web 的应用程序添加 pdf417(驾驶执照)解码/阅读。

输入:驾驶执照的图像。 (400-600 dpi)

处理:检测/解析 pdf417 数据。

输出:解析 pdf417 数据。

限制:它是一个基于 Web 的应用程序,通过以下方式运行:IE、Chrome、Safari。我无法在本地机器上安装任何东西。

所以我已经调查了几天,但我还没有找到一个很好的方法来完成这项工作。理想情况下,整个解码将在使用 Javascript/Jquery 的客户端机器上进行。但是我没有找到可以做到这一点的脚本/库。我发现的唯一其他选择可能是 java servlet 或 php 扩展;两者都不理想,因为上传时间会让我超过我的时间分配。

有谁知道可以处理这个问题的任何 javascript 或 JQuery 库吗?

或者也许是一种更好的方式来整合我没有看到的这个功能?

【问题讨论】:

    标签: javascript jquery html decoder pdf417


    【解决方案1】:

    我的贡献是双重的。首先(好消息!)我 100% 确定希望您使用 JavaScript 是可以实现的 CAVEAT:Chrome / Firefox 可能一切正常,但它只适用于更现代版本的 Safari(6+)和 IE(IE10+ )。来源http://caniuse.com/filereader

    其次,我希望我的贡献能够让您在解决问题方面走得更远,尽管我承认我还没有提出 PDF417 图像读取算法,这将是最后一块拼图。

    好的,我们开始: a) 让 JavaScript(在客户端机器上运行)向用户呈现一个 GUI,以允许他们从本地文件系统中选择一个文件(他们的驾驶执照图片),然后... b) 将其带入 JavaScript 应用程序(均不涉及服务器或 Java);和 ... c) ...让 JavaScript 解析它并解释 PDF417 条形码的暗/亮模式,以推断其中编码的“纯文本”人类可读数据。我提到 Java 不是一个选项,因为 Java 小程序似乎永远不会被允许在 Chrome 中运行,尽管 Java 有一个很好的图像数据处理包,它很适合这个东西。

    a) 所需的理解和代码

    HTML 表单多年来一直允许程序员使用文件上传字段。你需要:

    <input type="file" id="myFileInput">
    

    b) 所需的理解和代码

    此外,在 JavaScript 方面,您需要(最重要的是)使用 HTML5 FileReader Api(请参阅 http://blog.teamtreehouse.com/reading-files-using-the-html5-filereader-api)...vis-a-vis:

    var reader = new FileReader();
    // ... and ...
    reader.readAsDataURL(file);
    

    readAsDataURL() 将为您提供base64 编码的二进制数据,当涉及到插入使用var ing = new Image(); 实例化的图像实例的src 属性时,该数据将为您工作。即将src设置为data:image/gif;base64,*data* 这样你至少可以在你的网页上显示驾驶执照。稍后我会提到获取这个新实例化的图像并通过 Canvas 的 2D 上下文显示作为将新图像附加到 DOM 的替代方法,但我们稍后会谈到。到目前为止,我所讨论的所有内容都可以在 blog.teamtreehouse.com 的代码笔演示 (http://codepen.io/matt-west/pen/CfilG) 上的操作中看到。此外,对于FileReader() 的初学者更友好的讨论,您可能需要观看此视频 (http://www.sitepoint.com/reading-images-data-using-canvas-javascript/),但请耐心等待,因为您想要的有关图像上传和显示的内容只会在 5 分钟 30 秒内被提及。

    c) 所需的理解和代码

    这是我遇到困难的地方,因为我没能找到你想要的东西,但我确实找到了 UPC 格式条形码:http://badassjs.com/post/654334959/barcode-scanning-in-javascript(演示 = http://tobeytailor.s3.amazonaws.com/get_barcode_from_image/index.html)。我不确定,但我认为要实现这一点,Tobey 必须从new Image() 蚕食数据(一旦它的src 已通过fileReader() API 填充数据)并将其用于Canvas 2d 上下文。它证明了它是可以做到的,但是在编写算法以了解如何解释您必须理解 PDF417 的数据时:我发现这些链接是有用的起点

    http://en.wikipedia.org/wiki/PDF417

    http://omniplanar.com/PDF417-2D-Barcode.php

    祝你好运!

    【讨论】:

      【解决方案2】:

      我们做了一个原型来做你想做的事,作为我们创建的一部分 - https://github.com/PeculiarVentures/js-zxing-pdf417 处理 PDF417 解析。

      此解决方案是 100% 客户端。

      我们发现了相机分辨率和缺乏自动对焦的问题,但如果您从文件中读取代码,则不会有问题。

      我也相信对网络摄像头拍摄的图片进行一些预处理(帧平均、锐化滤镜等),您甚至可以让网络摄像头外壳可靠地工作。

      【讨论】:

        【解决方案3】:

        Emscripten https://github.com/kripken/emscripten 提供了一个现成的根来将 C++ 编译为 JavaScript。 https://www.newtonapples.net/PDF417_demo/USBcam_demo.html 有一个演示交叉编译的 PDF417 阅读器,它将在连接了一个不错的 USB 网络摄像头的浏览器(Chrome 或 Firefox)中读取 javascript 中的 PDF417 条形码。然而,代码是商业而非开源的。

        【讨论】:

          猜你喜欢
          • 2020-10-16
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 2018-04-21
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          相关资源
          最近更新 更多