JavaScript实现图片文字识别与读取

时间:2019-03-05
本文章向大家介绍JavaScript实现图片文字识别与读取,主要包括JavaScript实现图片文字识别与读取使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。

JavaScript实现图片文字识别与读取(实现ORC)

  • Tesseract.js和ocrad.js两个js库
  1. Tesseract.js
    引入Tesseract.js
    Tesseract.recognize的识别方法有两个配置参数
    第一个参数可以是本地的一个图片,也可以是网络上的一个图片地址,还可以是一个base64格式的二进制图片格式;
    第二个参数就是配置信息,包括识别的语种等等。这里classify_bln_numeric_mode表示假定图片中只有数字,大家可以根据自己需要去设置不同的值
function recognize_image(){
	document.getElementById('transcription').innerText = "(等待中...)"
	Tesseract.recognize("./显示底部桌面.png", {
	  lang: 'chi_sim',
    classify_bln_numeric_mode: 1
}).then(function(result){
		console.log('哈哈',result.text);  //识别出的文字
		document.getElementById('transcription').className = "done"
 document.getElementById('transcription').innerText = result.text;
});
}				 
 </script>
 <div id="main">
 <!-- CODE大全:www.codedq.net -->
 <img id="pic" src="./显示底部桌面.png" "recognize_image()">
 <div id="transcription"></div>
 </div>
Tesseract.create({
    workerPath: '/path/to/worker.js',
    langPath: 'https://localhost/',
    corePath: 'https://localhost/index.js',
}).recognize("http://xxx/xxx.jpg", {
    lang: 'eng',
    classify_bln_numeric_mode: 1
}).then(function(result){
    $("#code").val(result.text);
});

workerPath: worker.js路径,worker.js可以从第一步中下载的dist目录中获取
langPath: 语言资源包请求地址,默认 https://cdn.rawgit.com/naptha/tessdata/gh-pages/3.02/。
语言包url可以通过 langPath + langCode + '.traineddata.gz’计算得到,例如英语的语言包地址在上例中就是 https://localhost/eng.traineddata.gz。这里说的语言是指图片中待识别的内容是何种语言,可以在 recognize 方法中通过第二个参数设置,上例中设置语言为 eng,完整的可取语言列表参见 https://github.com/naptha/tesseract.js/blob/master/docs/tesseract_lang_list.md
corePath: index.js 路径,默认 https://cdn.rawgit.com/naptha/tesseract.js-core/master/index.js

  • ocrad.js 和Tesseract.js用法一样
  • 缺点: 比如车牌,身份证,这些可做到零误差,其余的只能做通用的文字识别,获取模版识别 但是也有部分限制。