全面入门指南：Tesseract.js JavaScript OCR 库介绍、安装与使用教程

什么是 Tesseract.js？

Tesseract.js 是一款纯 JavaScript 的 OCR（Optical Character Recognition，光学字符识别）库，它将开源 Tesseract OCR 引擎（原生 C++ 实现）通过 WebAssembly 移植到浏览器与 Node.js 环境中，使前端/后端都能执行图片文字识别。支持超过 100 种语言、自动方向检测、段落/单词/字符级边界框输出等功能，部署灵活无需服务器计算，即刻识别图片中文本。

为什么选用 Tesseract.js？

纯前端运行：识别过程无需上传图片，保护隐私、实时反馈、降低服务器负载。
多语言支持：涵盖中英文、法语、德语等 100 多种语言。
跨环境适配：既可在浏览器通过 CDN 或模块加载，也可在 Node.js 中使用。
API 简洁灵活：封装了 createWorker、recognize 等易用接口，结合进 React、Express、Next.js 都很方便。

Tesseract.js 安装与配置方式

浏览器（CDN 引入）

<script src="https://unpkg.com/tesseract.js@latest/dist/tesseract.min.js"></script>
<script>
  const worker = Tesseract.createWorker({ logger: m => console.log(m) });
  // ...
</script>

React 或前端项目（npm / yarn）

npm install tesseract.js
# 或者
yarn add tesseract.js

Node.js 环境

npm install tesseract.js

版本 6.x 已解决多项内存泄漏问题、优化识别速度，并默认仅输出纯文本格式以提高性能。

使用代码示例

import { createWorker } from 'tesseract.js';

(async () => {
  const worker = createWorker({
    logger: m => console.log(m), // 监听进度信息
  });

  await worker.load();
  await worker.loadLanguage('eng');
  await worker.initialize('eng');
  
  const { data: { text } } = await worker.recognize(fileOrImage);
  console.log('识别文本：', text);

  await worker.terminate();
})();

其中关键步骤为：

创建 Worker 实例并绑定进度回调
加载核心及语言模型（如 eng）
初始化语言环境
调用 recognize() 输入图片，返回包含识别文本的结果对象
完成后调用 terminate() 释放资源

若有多张图像识别需求，建议只创建一个 worker，循环使用 recognize 后统一终止，提升效率。

React 示例结合进度条

const [ocrResult, setOcrResult] = useState('');
const [progress, setProgress] = useState(0);
const worker = createWorker({
  logger: m => setProgress(parseInt(m.progress * 100)),
});

const handleImage = async file => {
  await worker.load();
  await worker.loadLanguage('eng');
  await worker.initialize('eng');
  const { data: { text } } = await worker.recognize(file);
  setOcrResult(text);
  await worker.terminate();
};

return (
  <div>
    <input type="file" accept="image/*" onChange={e => handleImage(e.target.files[0])} />
    {progress > 0 && progress < 100 && <div>进度：{progress}%</div>}
    <div>{ocrResult}</div>
  </div>
);

Node.js + Express 后端示例

const express = require('express');
const multer = require('multer');
const { createWorker } = require('tesseract.js');
const upload = multer();

const app = express();

app.post('/ocr', upload.single('image'), async (req, res) => {
  const worker = createWorker();
  await worker.load();
  await worker.loadLanguage('eng');
  await worker.initialize('eng');
  const { data: { text } } = await worker.recognize(req.file.buffer);
  await worker.terminate();
  res.json({ text });
});

app.listen(3000);

用户可通过前端上传图片，后端处理 OCR 并返回识别结果。

性能优化与准确度提升建议

裁剪/压缩图片尺寸：降低识别延迟，尤其在移动端可能需 2 至 20 秒不等。
图像预处理：如二值化（threshold）、去噪（blur）、缩放、反色或倾斜校正等，有助提升识别质量。
局部识别：若只需识别图片中的部分文本区域（比如链接、数字区域），先检测文本区域再分别识别可以加快速度并减少误识。
结果校验与后处理：识别可能存在误差，结合正则、拼写检查、人工校对提高准确度。

典型应用场景

将扫描文档、发票、名片、验证码、数学题等图像内容自动转为机器可读文本
提高搜索与索引能力，如允许图片中包含的文字也可检索
无需上传本地图片，适用于对隐私敏感的行业
支持 React/Next.js/Vue 前端 OCR 工具集成
搭配服务端 Express 构建 OCR 微服务 API

Tesseract.js 是一款强大且灵活的 JavaScript OCR 库，适用于浏览器与 Node.js。它支持多语言、简单易用、无需额外后端识别服务，可快速集成到各种前端或后端应用中。掌握 worker 使用流程、合理处理图片与结果，以及添加适当的图像预处理技术与进度反馈，可以显著提升用户体验与识别质量。如果你想让你的应用支持图片文字转换，那么 Tesseract.js 是相当值得尝试的一款解决方案。

Tesseract.js 实现图片文字提取（OCR）工具示例：https://www.leaftools.net/ocr