源码论坛公告:本站是一个交流学习建站资源的社区论坛,旨在交流学习源码脚本等资源技术,欢迎大家投稿发言! 【点击此处将锦尚放在桌面

源码论坛,商业源码下载,尽在锦尚中国商业源码论坛

 找回密码
 会员注册

QQ登录

只需一步,快速开始

查看: 1991|回复: 0

[小程序开发] 微信小程序使用百度AI识别接口的通用封装Promise详解

[复制链接]

3102

主题

3503

帖子

13万

金币

超级版主

Rank: 8Rank: 8

积分
272470
发表于 2023-4-5 12:59:39 | 显示全部楼层 |阅读模式

百度AI开放平台
百度AI开放平台是目前市场上主流开放接口平台之一,新用户还可领取免费资源(适合我这种勤俭节约的人),本篇就来介绍如何对百度AI的开放接口进行通用封装。

百度接口调用封装(Promise)
此封装主要是针对需要上传图片识别的接口,比如翻译,身份证识别,车牌识别等等。其他不需要上传图片的接口,把wx.chooseMedia那部分去掉就可以。

前提准备:

注册百度AI账号
领取对应资源
创建应用,拿到client_id和client_secret(本封装方法的access_token是在小程序前端获取的,如果是把access_token放后端,通过调用后端接口获取的,url就换成自己的后端接口即可)。
封装代码:

先在utils文件夹下新增BadiduOcr.js文件,代码如下:

  1. /* 百度识别封装 */

  2. function BadiduOcr() {
  3.         return new Promise(function (resolve, reject) {
  4.                 // 图片识别
  5.                 wx.chooseMedia({ // 车牌图片/拍照
  6.                         count: 1, // 最多可以选择的文件个数
  7.                         mediaType: ['image'], //文件类型
  8.                         sizeType: ['original', 'compressed'], //是否压缩所选文件
  9.                         sourceType: ['album', 'camera'], // 图片来源
  10.                         success(res) { //调用照片选择成功的回调函数
  11.                                 console.log(res);
  12.                                 //图片编码部分核心代码 上传到接口需要将图片转为base64格式
  13.                                 wx.getFileSystemManager().readFile({
  14.                                         filePath: res.tempFiles[0].tempFilePath,
  15.                                         encoding: 'base64', //编码格式
  16.                                         success(ans) {
  17.                                                 // console.log(ans.data)
  18.                                                 wx.showLoading({
  19.                                                         title: '识别中'
  20.                                                 })
  21.                                                 //ans.data:保存了图片转码之后的数据
  22.                                                 // 1.请求获取百度的access_token
  23.                                                 wx.request({
  24.                                                         //url中的&client_id=client-i&client_secret=client—s中的参数client-i和client—s需要申请百度识别的账号和密码,具体申请流程参考上面
  25.                                                         url: 'https://aip.baidubce.com/oauth/2.0/token?grant_type=client_credentials&client_id=你的client_id&client_secret=你的client_secret',
  26.                                                         data: {}, //请求参数,此处没有参数,则置空
  27.                                                         header: {
  28.                                                                 'content-type': 'application/x-www-form-urlencoded' // 默认值
  29.                                                         },
  30.                                                         success(rep) {
  31.                                                                 var access_token = rep.data.access_token;
  32.                                                                 console.log("access_token:", access_token)
  33.                                                                 // 2.带着token与转码后的图片编码请求百度OCR接口,对图片进行识别
  34.                                                                 wx.request({
  35.                                                                         url: 'https://aip.baidubce.com/百度识别的具体接口?access_token=' + access_token,
  36.                                                                         method: 'POST',
  37.                                                                         header: {
  38.                                                                                 'Content-Type': 'application/x-www-form-urlencoded'
  39.                                                                         },
  40.                                                                         data: {
  41.                                                                                 image: ans.data, //ans.data:图片编码
  42.                                                                         },
  43.                                                                         success(_res) {
  44.                                                                                 wx.hideLoading();
  45.                                                                                 resolve(_res)
  46.                                                                                 console.log("识别成功:", _res)
  47.                                                                         },
  48.                                                                         fail(_res) {
  49.                                                                                 wx.hideLoading();
  50.                                                                                 wx.showToast({
  51.                                                                                         title: '请求出错',
  52.                                                                                         icon: 'none'
  53.                                                                                 })
  54.                                                                                 reject(_res)
  55.                                                                         }
  56.                                                                 })
  57.                                                         },
  58.                                                         fail(rep) {
  59.                                                                 wx.hideLoading();
  60.                                                                 wx.showToast({
  61.                                                                         title: '请求出错',
  62.                                                                         icon: 'none'
  63.                                                                 })
  64.                                                                 reject(rep)
  65.                                                         }

  66.                                                 });
  67.                                         },
  68.                                         fail(res) {
  69.                                                 wx.hideLoading();
  70.                                                 wx.showToast({
  71.                                                         title: '所选图片编码失败,请重试',
  72.                                                         icon: 'none'
  73.                                                 })
  74.                                                 reject(res)
  75.                                         }
  76.                                 })

  77.                         },
  78.                         fail(res) {
  79.                                 wx.hideLoading();
  80.                                 wx.showToast({
  81.                                         title: '图片选择失败,请重试',
  82.                                         icon: 'none'
  83.                                 })
  84.                                 reject(res)
  85.                         }
  86.                 })
  87.         })
  88. }
  89. module.exports = {
  90.         BadiduOcr: BadiduOcr
  91. }
复制代码

调用
  1.    <button width="200rpx" height="64rpx" size="{{30}}" bindtap="getNum" bold>百度识别</tui-button>
复制代码

  1. import {
  2.     BadiduOcr
  3. } from '../../utils/BadiduOcr'
  4. Page({
  5.          /* 选择文件,识别 */
  6.     getNum() {
  7.         BadiduOcr().then(res => {
  8.             console.log(res);
  9.             if (res.statusCode == 200) {
  10.                 wx.showToast({
  11.                     title: '识别成功',
  12.                 })
  13.                
  14.             }
  15.         }).catch(err => {
  16.             console.log(err);
  17.         })
  18.     },
  19. })
复制代码


您需要登录后才可以回帖 登录 | 会员注册

本版积分规则

锦尚中国源码论坛

聚合标签|锦尚中国,为中国网站设计添动力 ( 鲁ICP备09033200号 ) |网站地图

GMT+8, 2024-5-19 02:55 , Processed in 0.027923 second(s), 16 queries .

带宽由 锦尚数据 提供 专业的数据中心

© 锦尚中国源码论坛 52jscn Inc. 非法入侵必将受到法律制裁 法律顾问:IT法律网 & 褚福省律师 锦尚爱心 版权申诉 版权与免责声明