微信小程序【人脸识别功能】

前几天偶然看见一个人脸识别的小程序demo，觉得很有趣下载下来想玩玩，结果只是一个框架而已用不了的，花了点时间完善一下

吐槽一下wx.uploadFile这个接口，真是个大坑，最开始调用时候，我以为它和同期的wx.downloadFile一样，只需要填入必须的参数就可以用，结果还是要配合后台php的

首先，upload这个接口的url和request一样指的是php的路径，而不是download一样文件路径

其次，我在最开始一直没弄懂这个"name"到底应该填什么，上传功能不好用我一直觉得是"name"的原因，官方对于name给的解释很迷，这里我就给个结论，大家不要纠结这个属性，直接写file就好，图片属性是能用的

最后，人脸识别功能的功能本身是第三方提供的，比如我用的就是阿里云的人脸识别功能，不到一分钱一张图片充值一块钱就可以玩的很嗨

那么，上代码，我的代码基本就是网上的demo+自己修改

首先是wxml

  
    
    {{userInfo.tips}}
  
  
  {{motto}}
  

然后js代码

var app = getApp()
Page({
  data: {
    motto: '上传靓照',
    userInfo: {},
    tempFilePaths: ''
  },
  chooseimage: function () {
    var that = this;
    wx.chooseImage({      //选择图片
      count: 1,
      sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
      sourceType: ['album', 'camera'], 
      success: function (res) {
        var tempFilePaths = res.tempFilePaths
        that.setData({
          tempFilePaths: tempFilePaths[0]
        })
        wx.uploadFile({     //上传图片
          url: '',  //这里是你php的路径！！
          filePath: tempFilePaths[0],
          name: 'file',
          header: {
            'content-type': 'multipart/form-data'
          },
          success: function (res) {
            console.log("add success", res.data);
            that.uploadImage(res.data);
            wx.showToast({
              title: "图片上传成功",
              icon: 'success',
              duration: 700
            })
          }
        })
      }
    })
  },
  //事件处理函数
  uploadImage: function(picName) {
    var that = this
    wx.showToast({
      title: '鉴定中，请稍候',
      icon: 'loading',
      duration: 2000
})
     wx.request({
        url: '',        //这里是阿里云人脸识别功能php的路径
        data: {
          type: 0,
          image_url: picName,
        },
        header: {
          'Content-Type': 'application/json'
        },
     // filePath: tempFilePaths[0],
      name: 'file',
      success: function(res){
        console.log(res.data) 
        wx.hideToast()
        var data = res.data;
        var sex = data.gender;
        const genders = {
          'Male': '基佬',
          'Female': '小仙女'
        }   
        if(data.face_num == 0){
          that.setData({
            userInfo:{
            tips:'未检测到人脸'
            }
          })
          return
        } else {
          if (sex == 0) {
            that.setData({
              userInfo: {
                tips: data.face_num + '位' + data.age + '岁的' + genders.Female
              }
            })
          } else {
            that.setData({
              userInfo: {
                tips: data.face_num + '位' + data.age + '岁的' + genders.Male
              }
            })
          }
          return
        }   
      }
    })
   },
  onLoad: function () {
    console.log('onLoad');

  },
  onShareAppMessage: function () {
    
  }
})

最后上php

首先是阿里云人脸识别功能代码

 0,
	'image_url' => $image_url
);
$options = array(
    'http' => array(
        'header' => array(
            'accept'=> "application/json",
            'content-type'=> "application/json",
            'date'=> gmdate("D, d M Y H:i:s \G\M\T"),
            'authorization' => ''
        ),
        'method' => "POST", //可以是 GET, POST, DELETE, PUT
        'content' => json_encode($content)//如有数据，请用json_encode()进行编码
    )
);
$http = $options['http'];
$header = $http['header'];
$urlObj = parse_url($url);
if(empty($urlObj["query"]))
    $path = $urlObj["path"];
else
    $path = $urlObj["path"]."?".$urlObj["query"];
$body = $http['content'];
if(empty($body))
    $bodymd5 = $body;
else
    $bodymd5 = base64_encode(md5($body,true));
$stringToSign = $http['method']."\n".$header['accept']."\n".$bodymd5."\n".$header['content-type']."\n".$header['date']."\n".$path;
$signature = base64_encode(
    hash_hmac(
        "sha1",
        $stringToSign,
        $akSecret, true));
$authHeader = "Dataplus "."$akId".":"."$signature";
$options['http']['header']['authorization'] = $authHeader;
$options['http']['header'] = implode(
    array_map(
        function($key, $val){
            return $key.":".$val."\r\n";
        },
        array_keys($options['http']['header']),
        $options['http']['header']));
$context = stream_context_create($options);
$file = file_get_contents($url, false, $context );
echo($file);
?>

然后是后台图片上传服务器功能，这里的代码也是我参考大佬，然后自己修改的【侵删】

人脸识别的功能就完成了，最后上效果图，帅气的我胡，打call

欢迎大神讨论