如何在React应用程序中使用Tesseract.js [英] How to use Tesseract.js in a React app

查看:141
本文介绍了如何在React应用程序中使用Tesseract.js的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在使用React开发一个应用程序.我希望能够加载图片,然后让Tesseract.js将其转换为文本.我正在使用react-dropzone加载图像文件,并且可以使用img标签将图像添加到页面.但是,当我尝试使用Tesseract运行ocr时,出现此错误:

I am working on an app using React. I want to be able to load a pic and then have Tesseract.js convert it to text. I am using react-dropzone to load the image file and I can add the image to page with an img tag. But when I try to run the ocr using Tesseract It gives me this error:

未捕获到的SyntaxError:意外令牌< 在blob: http://localhost:3000/ccac34f4-1f4a-4ba6-b455- a44345b71012:1 (匿名)@ blob: http://localhost:3000/ccac34f4-1f4a-4ba6 -b455-a44345b71012:1

Uncaught SyntaxError: Unexpected token < at blob:http://localhost:3000/ccac34f4-1f4a-4ba6-b455-a44345b71012:1 (anonymous) @ blob:http://localhost:3000/ccac34f4-1f4a-4ba6-b455-a44345b71012:1

我读过一篇文章说使用CDN,但是Tesseract不包含在我的构建过程中,这会引发错误.因此,我认为必须包含它才能使用React.

One post I read said to use a CDN, but then Tesseract is not included in my build process, which throws an error. So I think that I have to include it to use React.

推荐答案

我遇到了同样的问题,然后我不得不花点时间才能使其使用CDN正常​​工作.

I had the same issue, and then I had to dig a bit to have it working using the CDN.

这是我所做的,希望这可以对您有所帮助:

Here is what I did, I hope this can help a bit as a workaround:

  1. <head></head>
  2. 内的index.html中添加<script src='https://cdn.rawgit.com/naptha/tesseract.js/1.0.10/dist/tesseract.js'></script>
  3. 在App.js中添加var Tesseract = window.Tesseract;

参考文献: https://github.com/naptha/tesseract.js/issues/134

这篇关于如何在React应用程序中使用Tesseract.js的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆