反应PWA上的MRZ扫描仪

我正在尝试通过pwa中的网络摄像头/移动摄像头扫描 MRZ / Id 。我正在使用tesseract.js在浏览器中将图像解码为文本。这是我的代码:

import React from "react";
import Webcam from "react-webcam";
import { createCanvas,loadImage } from 'canvas'
import { createWorker } from 'tesseract.js';
import { isMobile } from 'mobile-device-detect';
const videoConstraints = {
    width: 1280,height: 720,facingMode: isMobile ? {  exact: 'environment'} : "user"
  };

const config = {
    lang: "eng",oem: 1,psm: 3,}

  const WebcamCapture = () => {
    const webcamRef = React.useRef(null);
    const canvasRef = React.useRef(null);

    const capture = React.useCallback(
      () => {
        const imageSrc = webcamRef.current.getScreenshot();

       drawImage(imageSrc); 

      },[webcamRef]
    );

      const drawImage = (imageSrc) =>{

        const {clientWidth,clientHeight}= webcamRef.current.video
        const canvas = createCanvas(clientWidth,clientHeight);
        const ctx = canvas.getcontext('2d')
        var imageObj1 = new window.Image();
        imageObj1.src = imageSrc;

imageObj1.onload = function() {
 ctx.drawImage(imageObj1,width,height);

        var imgPixels = ctx.getImageData(0,canvas.width,canvas.height);
           let finalimage = canvas.toDataURL('image/png');

        runOCR(finalimage)
      }

      const runOCR=(image)=>{
        const worker = createWorker({
          logger: m => console.log(m),// Add logger here
        });
        const {clientWidth,clientHeight}= webcamRef.current.video

        const recognize = async () => {
          await worker.load();
          await worker.loadLanguage('eng');
          await worker.initialize('eng');
           const textImage = await worker.recognize(image);
          console.log(textImage)
          alert(textImage.data.text);
          await worker.terminate();
        };        
       } 

问题在于,每当我在浏览器中调用tesseract.js时,它都会使用网络摄像头拍摄图像,但仅返回空文本。请让我知道我在这里想念的内容,如果您知道其他选择,也可以。

aa469011586 回答:反应PWA上的MRZ扫描仪

暂时没有好的解决方案,如果你有好的解决方案,请发邮件至:iooj@foxmail.com
本文链接:https://www.f2er.com/3162150.html

大家都在问