开源应用中心 | 如何快速开发一款文字识别应用

Ducan

发布于 2021-11-17 14:28:26

1.6K0

发布于 2021-11-17 14:28:26

在日常生活中，我们经常会需要将图片里的文字信息提取出来使用，通过人工方式采集的录入方式十分机械且效率低下。其实可以通过OCR技术，将印刷体、手写体的图片进行扫描即可将文字识别并录入系统中。市面上也存在较多OCR识别应用，但不一定能够适用于我们。

接下来，我们将基于开源应用uni-app和腾讯云开源应用插件中心适配的腾讯云文字识别（OCR）插件，快速的开发一款文字识别应用。 预备环境

本次开发基于uni-app框架，需要准备好uni-app开发环境

Uni-app 官网：

https://uniapp.dcloud.net.cn/

Uni-cloud 官网：

https://uniapp.dcloud.net.cn/uniCloud/README

HBuilderX：

官方IDE下载地址

腾讯云文字识别（OCR）插件：

官方文档

腾讯云文字识别（OCR）已经适配uni-app 仅需简单关联即可完成应用的封装。

制作方法

1. 打开Hbuilder IDE 创建uni-app项目并勾选启用uniCloud

2.上传云函数模版

2.1 查看插件安装指引

2.2 安装腾讯云插件-云函数模版选择使用HbuilderX 导入插件

2.3 在项目中打开 cloudfunctions/tencentcloud-plugin/config.js 文件，将腾讯云的密钥信息配置进去，可以在腾讯云 API密钥管理中获取 SecretId、SecretKey 和 APPID

2.4 将云函数上传到我们自己的云空间中，如果之前没有过云空间需要先创建再关联云空间，最后执行上传操作

3. 安装腾讯云文字识别（OCR）插件

3.1 访问腾讯云文字识别（OCR）插件页面选择使用HBuilderX 导入插件

导入成功后可以看到项目中会新增js_sdk目录，里面有tencentcloud-plugin-ocr目录表明导入成功

4. 根据自己的需求编写页面UI

（贴心提示：点击此处获得Demo源码）

5. 进行api调用（语言：javascript）

// 通用文字识别-英文识别使用示例
// 从js_sdk列表中导入需要的api
import { englishOCR } from '@/js_sdk/tencentcloud-plugin-ocr';
 
export default {
  methods: {
    async eventHandler() {
      try {
        //  图片的网络地址，也可以通过imageBase64参数使用base64形式传入图片，具体可以查看对应api的参数说明
        const img = 'https://ocr-demo-1254418846.cos.ap-guangzhou.myqcloud.com/general/EnglishOCR/EnglishOCR1.jpg';
        //  调用api获取识别结果
        const { result } = await englishOCR({imageUrl: img});
      } catch (error) {
        console.log(error);
      }
    }
  }
};

完成识别