【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>
相关推荐
智码看视界7 小时前
Day59-阿里云ACK实战:生产级K8s集群部署与运维
运维·阿里云·kubernetes·k8s·日志监控·容器运维·阿里云ack
云边云科技_云网融合8 小时前
生态共建 · 专业交付 | 我们与阿里云共建的 Landing Zone 标杆实践
阿里云·云计算
聚美智数13 小时前
护照OCR识别-护照图像识别-护照OCR文字识别-护照识别OCR-护照信息识别-护照OCR
android·ocr
宠友信息14 小时前
内容社区源码开发实践解析,用Spring Boot打造1:1仿小红书源码平台
java·spring boot·redis·websocket·mysql·spring·uni-app
梦曦i16 小时前
Vue-Router 2.4.0 新增可控重定向功能
前端·uni-app
郑州光合科技余经理16 小时前
海外版外卖系统架构:订单怎么流转、权限怎么分
java·开发语言·前端·系统架构·uni-app·php·ai编程
chunmiao303218 小时前
阿里云Wan3.0视频大模型上线:单次生成30秒还能读文档
阿里云·云计算·音视频
qq_3168377520 小时前
uniapp 安卓/H5 使用 contentEditable 属性 富文本编辑器
android·javascript·uni-app
yunlaodacom21 小时前
阿里云国际版代理商:OSS中文文件名上传正常,下载却NoSuchKey,URL编码怎么检查
阿里云·云计算