本文主要讲解关于超级离谱的前端需求：搜索图片里的文字！！难倒我了！相关内容，让我们来一起学习下吧！
前言
大家好，我是林三心，用最通俗易懂的话讲最难的知识点是我的座右铭，基础是进阶的前提是我的初心~
背景
是这样的，我们公司有一个平台，这个平台上面有一个页面，是一个我们公司内部存放一些字幕图片的，图片很多，差不多每一页有100张的样子，类似于下面这样的图片
前几天上面大佬们说想要更加方便快捷地找到某一张图片，怎么个快捷法呢？就是通过搜索文字，能搜索到包含这些文字的图片。。。我一想，这需求简直逆天啊！！！！平时只做过搜索文字的，没做过根据文字搜索出图片的。。。。
思路
其实思路很清晰，分析出每一张图片上的文字，并存在对象的keyword中，搜搜的时候去过滤出keyword包含搜索文字的图片即可。
但是难就难在，我要怎么分析出图片上的文字并存起来呢？
tesseract.js
于是我就去网上找找有哪些库可以实现这个功能，你还真别说，还真有！！这个库就是tesseract.js
tesseract.js 是一个可以分析出图片上文字的一个库，我们通过一个小例子来看看他的使用方式
首先需要安装这个库
npm i tesseract.js
接着引入并使用它解析图片文字，它识别后会返回一个 Promise，成功的话会走 then
可以看出他直接能把图片上的结果解析出来！！！真的牛逼！！！有了这个，那我轻轻松松就可以完成上面交代的任务了！！！
实现功能
我们需要解析每一张图片的文字，并存入 keyword属性中，以供过滤筛选
可以看到每一张图片都解析得到keyword
那么搜索效果自然可以完成
搜索中文呢？
上面只能解析英文，可以看到有 eng 这个参数，那怎么才能解析中文呢？只需要改成chi_sim即可
如果你想要中文和英文一起解析，可以这么写eng+chi_sim
结语 & 加学习群 & 摸鱼群
我是林三心
- 一个待过小型toG型外包公司、大型外包公司、小公司、潜力型创业公司、大公司的作死型前端选手；
- 一个偏前端的全干工程师；
- 一个不正经的掘金作者；
- 一个逗比的B站up主；
- 一个不帅的小红书博主；
- 一个喜欢打铁的篮球菜鸟；
- 一个喜欢历史的乏味少年；
- 一个喜欢rap的五音不全弱鸡
如果你想一起学习前端，一起摸鱼，一起研究简历优化，一起研究面试进步，一起交流历史音乐篮球rap，可以来俺的摸鱼学习群哈哈，点这个，有7000多名前端小伙伴在等着一起学习哦 --> 摸鱼沸点
以上就是关于超级离谱的前端需求：搜索图片里的文字！！难倒我了！相关的全部内容，希望对你有帮助。欢迎持续关注程序员导航网，学习愉快哦！
