什么是 Tesseract.js？
Tesseract.js 是一个基于 JavaScript 的开源 OCR（光学字符识别）库，它是 Google 维护的 Tesseract OCR 引擎的 WebAssembly 版本封装。该库支持在浏览器和 Node.js 环境中运行，能够识别超过 100 种语言的文本，包括中文、英文、法文、德文等。Tesseract.js 提供了简单易用的 API，适用于各种前端项目，如 Vue、React、Electron 等。
- Tesseract.js 官网：https://tesseract.projectnaptha.com/
- Tesseract.js GitHub地址：https://github.com/naptha/tesseract.js
通过 NPM 安装（适用于 Vue、React 等框架）
1. 安装 Tesseract.js
在项目目录中运行以下命令安装 Tesseract.js：
npm install tesseract.js
2. 代码示例
以下是一个在 Vue 或 React 项目中使用 Tesseract.js 进行图片文字识别的示例：
import { createWorker } from 'tesseract.js';
const worker = await createWorker({
logger: m => console.log(m), // 可选：用于查看识别进度
});
await worker.load();
await worker.loadLanguage('chi_sim'); // 设置识别语言，例如 'chi_sim' 表示简体中文
await worker.initialize('chi_sim');
const { data: { text } } = await worker.recognize('path/to/image.jpg'); // 替换为你的图片路径
console.log(text);
await worker.terminate();
上面的示例代码使用 createWorker 创建一个识别器，加载简体中文语言包，对指定图片进行文字识别，并输出识别结果。
通过 CDN 引入（适用于纯 HTML 页面）
1. 引入 Tesseract.js
在 HTML 文件中添加以下 <script> 标签，将 Tesseract.js 引入页面：
<script src="https://cdn.jsdelivr.net/npm/tesseract.js@5/dist/tesseract.min.js"></script>
2. 示例代码
加载 Tesseract.js 后，Tesseract 变量将全局可用，并且可以使用 Tesseract.createWorker 创建一个工作者对象。以下是一个在纯 HTML 页面中使用 Tesseract.js 进行图片文字识别的示例：
(async () => {
const worker = await Tesseract.createWorker(['eng', 'chi_sim']);
const ret = await worker.recognize('https://tesseract.projectnaptha.com/img/eng_bw.png');
console.log(ret.data.text);
await worker.terminate();
})();此示例设置了识别图片种的英文和中文文本。可以在file input的onchange事件里调用方法，直接把file对象传入recognize方法。
async function onchange(file) {
const worker = await Tesseract.createWorker(['eng', 'chi_sim']);
const ret = await worker.recognize(file);
console.log(ret.data.text);
await worker.terminate();
}常见问题与优化建议
- 语言支持：Tesseract.js 支持多种语言。要识别其他语言的文字，需要加载相应的语言数据。例如，识别英文可以使用 'eng'。
- 跨域问题：如果加载的图像来自不同的域，可能会遇到跨域（CORS）问题。为避免此类问题，建议用户上传本地图片，或确保服务器设置了适当的 CORS 头。
- 性能优化：对于大型图像或高分辨率图像，识别过程可能较慢。可以在识别前对图像进行预处理，例如缩放、灰度化等，以提高识别速度和准确性。
- 离线使用：Tesseract.js 支持离线使用。可以将所需的语言数据文件下载到本地，并在初始化时指定语言数据的路径，以减少首次加载时间。
Tesseract.js 是一个强大的前端 OCR 库，适用于各种前端项目。无论是通过 NPM 安装，还是通过 CDN 引入，都可以方便地在浏览器中实现图片文字识别功能。通过合理的配置和优化，可以满足大部分中小型应用的需求。