VUE 之百度OCR证件识别获取access_token详细步骤

3 篇文章 0 订阅
本文介绍了在Vue项目中如何通过配置vue.config.js的代理解决跨域问题,以便调用百度的在线OCR接口。首先在devServer中设置代理,将/baiduOCR路径指向百度的API地址,并启用changeOrigin和secure选项。然后封装获取access_token的请求函数,并在组件中调用该函数,传入必要的认证参数进行访问。最后,展示了成功获取access_token的打印结果。
摘要由CSDN通过智能技术生成

步骤:

由于直接访问百度在线api会跨域,配置代理解决跨域:
vue.config.js中配置

devServer: {
    port: port,
    open: true,
    overlay: {
      warnings: false,
      errors: true
    },
    proxy: {
      '/baiduOCR': {
        target: 'https://aip.baidubce.com', // 百度在线请求地址https://aip.baidubce.com/oauth/2.0/token
        changeOrigin: true,
        secure: false, // 因为是https 地址需要次选项
        pathRewrite: {
          '^/baiduOCR': ''
        }
      }
    }
  },
  //注意:配置完一定要重启项目!!!

封装获取access_token请求:

// OCR识别
export function identificationRecognize(params) {
  return request({
    url: '/baiduApi/oauth/2.0/token',
    method: 'get',
    params
  })
}

组件中直接引用调用:

import { identificationRecognize } from '@/api/user/driver'

created() {
    const data = { //这三个参数不能少
      grant_type: 'client_credentials',//固定参数
      client_id: 'Bf69EFs5C0iImsEGB4SAlpnF',//你申请的AK
      client_secret: '3hWvIKI4lhgUOqziHCIosUDtPBixMmE9'//你申请的SK
    }
    identificationRecognize(data).then(res => { console.log(`access_token---`, res) })
  }

打印结果:
在这里插入图片描述

  • 2
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 4
    评论
评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

赫兹/Herzz

如果我的博文帮助到您请打赏支持

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值