阅读 17

基于百度AI接口的微信小程序-人脸搜索

  • 本文主要介绍基于百度云人脸识别接口实现微信小程序人脸搜索
  • 开发前的准备:
  • 参考文档:
  • 在写小程序端的代码前,还需要去百度ai平台创建相关应用实例,不清楚的读者可以参考我之前的的文章,当然,建议直接看,写得很详细。
  • 代码:
    1、Wxml:
      
        
        
      
        
          
          
          
          
        
      

2、Wxss:

    page {
      background: white;
    }
    
    .container {
      display: flex;
      flex-direction: column;
      align-items: center;
    }
    
    .button_container {
      margin-top: 600rpx;
      display: flex;
      flex-direction: column;
    }
    
    .camera {
      width: 300rpx;
      height: 300rpx;
      border-radius: 50%;
      position: fixed;
      top: 100rpx;
    }
    
    .button {
      margin-top: 20rpx;
      width: 100rpx;
      height: 60rpx;
      background: forestgreen;
      color: white;
    }

3、Javascript:

    // camera.js
    Page({
      data: {
        src: "",
        token: "",
        base64: "",
        msg: "",
      },
      //上传至人脸库
      upload(){
        this.takePhoto();
        this.faceUpload();
      },
      //进行人脸识别
      check(){
        this.takePhoto();
        this.faceRecognition();
      },
    
    //拍照
      takePhoto() {
        var that = this;
        //创建拍照上下文对象
        const ctx = wx.createCameraContext()
        ctx.takePhoto({
          quality: ‘high‘,
          //拍照成功
          success: (res) => {
            console.log(res)
            wx.getFileSystemManager().readFile({
              filePath: res.tempImagePath,
              encoding: ‘base64‘,
              success: res => {
                console.log(res)
                this.setData({
                  base64: res.data
                })
              },
               //拍照失败
              fail: err => {
                console.log(err)
                this.showToast("调用失败,请稍后重试");
              }
            })
          },
          fail: err => {
            this.showToast("调用失败,请稍后重试");
          }
        })
      },
    //人脸上传
      faceUpload(group_id, user_id) {
        //调用接口,获取token
        wx.request({
          url: ‘https://aip.baidubce.com/oauth/2.0/token‘, //百度智能云相关的接口地址
          data: {
            grant_type: ‘client_credentials‘,
            client_id: ‘xxxxxxxxxxxxxxxx‘,//用你创建的应用的API Key
            client_secret: ‘xxxxxxxxxxxxxxxx‘//用你创建的应用的Secret Key
          },
          header: {
            ‘Content-Type‘: ‘application/json‘ // 默认值
          },
          //获取到之后,请求接口,向人脸库添加照片
          success: res => {
            console.log(res)
            wx.request({
              url: ‘https://aip.baidubce.com/rest/2.0/face/v3/faceset/user/add?access_token=‘ + res.data.access_token,
              method: ‘POST‘,
              data: {
                image: this.data.base64,
                image_type: ‘BASE64‘,
                group_id:‘xxx‘,//用户组的id
                user_id:"xxxx"//给用户指定的id
              },
              header: {
                ‘Content-Type‘: ‘application/json‘
              },
              success: res => {
                // console.log(res)
                if (res.data.error_msg == ‘SUCCESS‘) {
                  wx.hideLoading();
                  this.showToast("上传成功");
                } else {
                  this.showToast("上传失败,请稍后重试");
                }
              },
              fail(err) {
                this.showToast("上传失败,请稍后重试");
              }
            })
          },
          fail(err) {
            // console.log(err)
            this.showToast("上传失败,请稍后重试");
          }
        })
      },
    
      //人脸识别
      faceRecognition( group_id_list) {
        var that = this;
        wx.showLoading({
          title: ‘识别中‘,
        })
        //获取token
        wx.request({
          url: ‘https://aip.baidubce.com/oauth/2.0/token‘, //真实的接口地址
          data: {
            grant_type: ‘client_credentials‘,
            client_id: ‘xxxxxxxxxxxxxx‘,
            client_secret: ‘xxxxxxxxxxxxxxxx‘
          },
          header: {
            ‘Content-Type‘: ‘application/json‘
          },
          //有了token之后,进行人脸识别
          success: res => {
            wx.request({
              url: ‘https://aip.baidubce.com/rest/2.0/face/v3/search?access_token=‘ + res.data.access_token,
              method: ‘POST‘,
              data: {
                image: that.data.base64,
                image_type: ‘BASE64‘,
                group_id_list: ‘xxxx‘//你创建的应用的用户组id
              },
              header: {
                ‘Content-Type‘: ‘application/json‘
              },
              success: res => {
                wx.hideLoading();
                console.log(res)
                that.setData({
                  msg: parseInt(res.data.result.user_list[0].score)
                })
                if (that.data.msg > 80) {
                  let title = "识别通过,匹配率:" + this.data.msg + "%";
                  this.showToast(title)
                } else {
                  let title = "识别未通过,匹配率:" + this.data.msg + "%";
                  this.showToast(title)
                }
              },
              fail: err => {
                wx.hideLoading();
                this.showToast("调用失败,请稍后重试")
              }
            });
          }
        })
      },
    //封装的wx.showToast
      showToast(title) {
        wx.showToast({
          title: title,
          icon: ‘none‘,
          duration: 3000
        })
      }
    })

请求中body中相关的参数这里就不一一说明了,详情请阅读。
本文只介绍了简单的人脸搜索实现方法,由于功力有限,还望多多指教。

原文:https://www.cnblogs.com/xunxian/p/12906505.html

文章分类
代码人生
版权声明:本站是系统测试站点,无实际运营。本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 XXXXXXo@163.com 举报,一经查实,本站将立刻删除。
相关推荐