pdf417 Javascript 읽기/디코딩

Question

웹 기반 응용 프로그램에 대한 pdf417 (운전 면허증) 디코딩/읽기를 추가해야 할 의무가 있습니다.

입력 : 운전 면허증 이미지. (400-600dpi)

처리 중 : pdf417 데이터 검색/구문 분석.

출력 : pdf417 데이터를 분석하십시오.

제한 사항 : 해당 웹 기반 앱 : IE, Chrome, Safari. 나는 로컬 컴퓨터에 아무것도 설치할 수 없다.

저는 며칠 동안 조사를 해왔으므로이 작업을 수행하는 좋은 방법을 찾지 못했습니다. Javascript/Jquery를 사용하여 클라이언트 시스템에서 전체 디코딩이 이루어지는 것이 이상적입니다. 그러나 나는 이것을 할 수있는 스크립트/라이브러리를 발견하지 못했습니다. 내가 발견 한 유일한 다른 옵션은 아마도 자바 서블릿이나 PHP 확장 기능이었습니다. 업로드 시간이 내 시간 이상으로 나를 밀어 붙일 것이기 때문에 둘 다 이상적이지 않습니다.

누구든지 이것을 처리 할 수있는 자바 스크립트 또는 JQuery 라이브러리를 알고 있습니까?

아니면 내가보기 싫은이 기능을 통합하는 더 좋은 방법은 없을까요?

Answer 1

내 기여 글은 2 배입니다. Chrome/Firefox는 아마도 모두 정상이지만 Safari (6+) 및 IE (IE10 +)의 최신 버전에서만 작동 할 것입니다.). Source http://caniuse.com/filereader

두 번째로 나는 퍼즐의 마지막 조각이 될 PDF417 이미지 읽기 알고리즘을 생각해 내지 못했다고 인정하지만이 문제를 해결하는 데 큰 도움이되기를 바랍니다. 여기

OK 우리가 간다 : 는) 그들의 로컬 파일 시스템에서 파일 (자신의 운전 면허증의 사진을 선택할 수 있도록 사용자에게 GUI를 제공) 클라이언트 컴퓨터에서 실행되는 자바 스크립트 (가지려면) 그런 다음 ... b) 자바 스크립트 앱으로 가져 오기 (서버 또는 자바를 사용하지 않고 모두). 그리고 ... c) ... JavaScript에서 구문 분석하여 PDF417 바코드의 어두운/밝은 패턴을 해석하여 사람이 읽을 수있는 '평문'데이터를 추출합니다. 나는 Java가 비록이 일에 잘 분류 된 멋진 이미지 데이터 처리 패키지를 가지고 있지만 자바 애플릿이 선택 사항이 아니라는 점을 언급한다. A에 대한 요구

이해 및 코드)

HTML 양식이 프로그래머가 여러 해 동안 파일 업로드 필드를 사용할 수있다. 당신이 필요합니다 :

또한 B에 필요한

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

이해 및 코드), 사물의 자바 스크립트 측에서 (http://blog.teamtreehouse.com/reading-files-using-the-html5-filereader-api를 참조하면합니다 (HTML5을 FileReader API를 가장 중요하게) 사용을해야합니다) ...마주 : 그것은 인스턴스화 이미지의 인스턴스의 src 특성에 슬로 팅에 관해서 readAsDataURL()는 것입니다

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

당신에게 당신을 위해 일 것입니다 base64로 인코딩 바이너리 데이터를 제공하는 방법 var ing = new Image();. 즉 src을 data:image/gif;base64,*data*으로 설정하면 운전 면허를 웹 페이지에 표시 할 수 있습니다. 나중에이 새롭게 인스턴스화 된 이미지를 가져 와서 appendChild()에 대한 대안으로 Canvas의 2D 컨텍스트를 통해 표시하는 것에 대해 언급하지만 새로운 이미지를 DOM에 삽입하는 방법에 대해서는 잠시 후에 설명하겠습니다. 지금까지 토론 한 모든 내용은 blog.teamtreehouse.com의 코드 펜 데모 (http://codepen.io/matt-west/pen/CfilG)에서 볼 수 있습니다. 또한 FileReader()의 더 초보자 친화적 인 대담을 통해 당신이 비디오 (http://www.sitepoint.com/reading-images-data-using-canvas-javascript/)를 볼 수 있지만 이미지 업로드에 대해 원하는 물건으로 인내심 만 언급됩니다 5mins30secs를 표시 할 수 있습니다. 필요한

이해와 코드를) 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() (데이터가 fileReader() API를 통해 데이터로 채워진 후) 캔버스 2d 컨텍스트에서 데이터를 식인해야한다고 생각합니다. 그것은 수행 할 수 있음을 증명하지만 알고리즘을 서면으로 당신이 PDF417을 이해해야 할 것 데이터를 해석하는 방법을 알고 : 나는 유용한 출발 장소

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

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

좋은에게 이러한 링크를 발견 운!

Answer 2

우리가 만든 작업의 ​​일부로 정확히 우리가 만든 프로토 타입을 만들었습니다. 즉, https://github.com/PeculiarVentures/js-zxing-pdf417은 PDF417 구문 분석을 처리합니다.

이 솔루션은 100 % 클라이언트 측입니다.

카메라 해상도 및 자동 초점 부족 문제가 발견되었지만 파일에서 코드를 읽는 중에는 문제가 없습니다.

웹캠 캡처 된 사진 (프레임 평균, 선명하게하는 필터 등)의 일부 사전 처리 작업을 통해 웹 카메라 케이스를 안정적으로 작동시킬 수도 있습니다.

Answer 3

Emscripten https://github.com/kripken/emscripten은 C++을 JavaScript로 컴파일 할 준비가 된 루트를 제공합니다. 괜찮은 USB 웹캠이 연결된 브라우저 (Chrome 또는 Firefox)의 javascript에서 PDF417 바코드를 읽는 https://www.newtonapples.net/PDF417_demo/USBcam_demo.html에 PDF417 독자 컴파일 데모가 있습니다. 그러나이 코드는 오픈 소스가 아닌 상업용입니다.