AI-recognition

类似识花君小程序AI识别功能

这里只说明简单的思路，具体的识别交互视项目而定，比如说拍照后页面关闭摄像头，展示当前拍的照片

思路

主要是调起摄像头实现拍照，用拍的图片请求接口，接口返回ai识别的内容

步骤

• 需要调起微信摄像头 （使用微信小程序camera组件）
• 实现拍照并记录图片 （拍照功能使用小程序api takePhoto）
• 从相册选择并记录图片 （从相册选择图片使用小程序api chooseImage）

主要代码

<!-- 这里camera组件只是调起摄像头 拍照和从相册选择图片的按钮和功能需要自己实现  可以自定义 -->
<camera
  device-position="back"
  flash="off"
  binderror="error"
  style="width: 100%; height: 100vh;">
</camera>

<!-- 自定义的样式使用position定位 设置层级即可 -->
<!-- 从相册选择按钮 -->
<image
  class="choose-photo"
  src="../../static/icon_photo@3x.png"
  mode="cover"
  bindtap="choosePhoto">
</image>

<!-- 拍照按钮 -->
<image
  class="take-photo"
  src="../../static/icon_camera@3x.png"
  mode="cover"
  bindtap="takePhoto">
</image>

// js
// 从相册选择识别方法
choosePhoto() {
  const that = this
  wx.chooseImage({
    count: 1,
    sizeType: ['original'],
    sourceType: ['album'],
    success(res) {
      // tempFilePath可以作为img标签的src属性显示图片
      console.log(res.tempFilePaths[0], 'res***********')
      // that.getScanInfo 是请求识别的接口
      that.getScanInfo(res.tempFilePaths[0])
    }
  })
},

// 拍照识别方法
takePhoto() {
  const that = this
  const ctx = wx.createCameraContext()
  ctx.takePhoto({
    quality: 'high',
    success: (res) => {
      console.log(res, 'res***********')
      // res.tempImagePath 就是拍照获取的图片
      // that.getScanInfo 是请求识别的接口
      that.getScanInfo(res.tempImagePath)
    }
  })
},

赏

谢谢你请我吃糖果

支付宝

微信