【uniapp】调用阿里云OCR图片识别文字:

文章目录


一、效果:
二、实现:

【阿里官方】高精版OCR文字识别【最新版】-云市场-阿里云

javascript 复制代码
<template>
	<view class="container">
		<!-- 选择图片 -->
		<button @click="imageOcrRecognition">选择图片</button>
		<view v-html="content"></view>
	</view>
</template>
  
<script>
	import { pathToBase64, base64ToPath } from 'image-tools'//npm i image-tools --save

	export default {
		data() {
			return {
				content: '',
			}
		},
    methods: {
			imageOcrRecognition() {
				const that = this;
				uni.chooseImage({
          count: 1,
					sizeType: ['original', 'compressed'],
					sourceType: ['album', 'camera'],
          success: (res) => {
						pathToBase64(res.tempFilePaths[0]).then(base64 => {
							uni.request({
								url: 'https://gjbsb.market.alicloudapi.com/ocrserve/advanced',
                dataType: 'json',
                header: {
									'Authorization': `APPCODE 你的AppCode`
                },
								data: { img: base64.substring(base64.indexOf(',') + 1) },
                method: 'POST',
								success(res) {
                  console.log(res);
									that.content = res.data.content;
								}
							})
            })
					}
				})
      },
		},
	}
</script>
相关推荐
沉到海底去吧Go4 小时前
【PDF识别改名】PDF指定区域OCR识别重命名工具使用教程和注意事项
python·pdf·ocr
海天胜景4 小时前
uniapp 字符包含的相关方法
uni-app
moxiaoran57537 小时前
uni-app萌宠案例学习笔记--页面布局和CSS样式设置
前端·css·uni-app
moxiaoran57538 小时前
uni-app学习笔记二十九--数据缓存
笔记·学习·uni-app
moxiaoran575313 小时前
uni-app学习笔记三十--request网络请求传参
笔记·学习·uni-app
小Tomkk15 小时前
阿里云 RDS mysql 5.7 怎么 添加白名单 并链接数据库
数据库·mysql·阿里云
疯狂的沙粒15 小时前
在uni-app中如何从Options API迁移到Composition API?
javascript·vue.js·uni-app
沉到海底去吧Go16 小时前
【图片自动识别改名】识别图片中的文字并批量改名的工具,根据文字对图片批量改名,基于QT和腾讯OCR识别的实现方案
数据库·qt·ocr·图片识别自动改名·图片区域识别改名·pdf识别改名
anyup18 小时前
快崩溃了!华为应用商店已经 4 次驳回我的应用上线
前端·华为·uni-app
alphaair1 天前
【一步步开发AI运动APP】十、微调优化内置运动分析器,灵活适配不同的应用场景
uni-app·ai运动·ai运动识别·ai健身·ai体测·ai运动app·ai运动检测·工会云上运动会·ai人体检测·ai姿态识别