### [微信小程序怎么实现人脸识别](https://www.prosaas.cn/article/17467)
**Published:** 2018-06-22T08:21:48
**Author:** 5201314
**Excerpt:** 这篇文章主要为大家详细介绍了微信小程序实现人脸识别,实现添加信息和上传照片功能,具有一定的参考价值,感兴趣的小…
这篇文章主要为大家详细介绍了微信小程序实现人脸识别,实现添加信息和上传照片功能,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
本文为大家分享了微信小程序人脸识别的具体代码,供大家参考,具体内容如下
首先,我们要有开发者工具,今天所说的是后端和前端联合起来实现的。
在PHP的控制器中写一个upload方法,代码如下:
public function upload($id=''){
if(empty($id)){
return false;
}
$no = M("student")->where("id={$id}")->getField('no');
$dir = "./Upload/studentface/";
if(!file\_exists($dir)){
mkdir($dir, 0777, true);
}
$upload = new \\Think\\Upload();// 实例化上传类
$upload->maxSize = 3145728 ;// 设置附件上传大小
$upload->exts = array('jpg', 'gif', 'png', 'jpeg');// 设置附件上传类型
$upload->rootPath = $dir; // 设置附件上传根目录
$upload->savePath = ''; // 设置附件上传(子)目录
$upload->saveName = $no;
$upload->replace = true;
$upload->autoSub = false;
// 上传文件
$info = $upload->uploadOne($\_FILES\['file'\]);
if(!$info) {// 上传错误提示错误信息
// return $this->ajaxReturn(array('error'=>true,'msg'=>$upload->getError()));
return json\_encode(array('error'=>true,'msg'=>$upload->getError()),JSON\_UNESCAPED\_UNICODE);
}else{// 上传成功 获取上传文件信息
// return $this->ajaxReturn(array('error'=>false,'msg'=>$info\['savepath'\].$info\['savename'\],'id'=>$id));
$file = $dir . $info\['savepath'\] . $info\['savename'\];
$image = base64\_encode(file\_get\_contents($file));
$this->facevalid($no,$image);
$m = M('head');
$data = $m->where("no='{$no}'")->find();
if($data){
//有数据,则更新
$m->where("no='{$no}'")->save(array('base64'=>$image, 'path'=>$file));
}else{
$m->add(array('no'=>$no,'base64'=>$image,'path'=>$file));
}
return "采集照片成功";
}
}
public function facevalid($no,$image,$file){
$options = array();
$options\["max\_face\_num"\] = 2;
// $options\["face\_type"\] = "LIVE";
// $image=file\_get\_contents($file);
// $image=base64\_encode($image);
// echo $image;
$imageType="BASE64";
// 带参数调用人脸检测
$client=$this->init\_face();
$ret=$client->detect($image,$imageType,$options);
// $arr=$ret;
// print\_r($ret);
// exit;
if($ret\['error\_code'\]==0){//有人脸
$result=$ret\['result'\];
$face\_num=$result\['face\_num'\];
if(1==$face\_num){//人脸数量为1
$face\_probability=$result\['face\_list'\]\[0\]\['face\_probability'\];
if(1==$face\_probability){//可靠性为1
$group=$this->face\_group();
// echo $group;
// exit;
$faces=$client->faceGetlist($no,$group);
if($faces\['error\_code'\]>0){
$client->addUser($image,'BASE64',$group,$no);
}else{
$client->updateUser($image,'BASE64',$group,$no);
}
// echo '人脸检测完成,并已入库';
// return true;
// $arr = array('error'=>false,'msg'=>'上传成功');
}else{
die('图片质量');
// die('图片质量仅为:'.$face\_probability.',上传失败');
}
}else{
die('人脸数量大于1');
// die('人脸数量大于1,失败');
}
}else{
die('没有人脸');
// die('没有人脸,失败');
}
}
在前端我们需要在开发者工具里写js和wxml.
js代码如下:
const app = getApp()
Page({
data: {
sex: '女',
empty:true
},
cancel: function () {
wx.redirectTo({
url: '../face/face',
})
},
switch1Change: function (e) {
if (e.detail.value) {
this.setData({ sex: '男' })
} else {
this.setData({ sex: '女' })
}
},
formSubmit: function (e) {
// console.log(e);
wx.request({
url: 'http://\*\*\*\*\*.top/ppp/server/index.php/home/index/index',
data: e.detail.value,
method: 'POST',
header: {
'content-type': 'application/x-www-form-urlencoded'
},
success: (res) => {
console.log(res.data);
if (res.data.error) {
wx.showToast({
title: res.data.msg,
icon: 'none',
duration: 2000
})
} else {
wx.showToast({
title: res.data.msg,
icon: 'success',
duration: 2000
})
setTimeout(function () {
wx.navigateTo({
url: '../headimg/headimg?id=' + res.data.id,
})
}, 2000)
}
}
})
}
})
上传图片js代码如下:
const app = getApp()
function upload(that, id) {
if (that.data.files.length == 0) {
return;
}
wx.uploadFile({
url: 'http://\*\*\*\*.top/ppp/server/index.php/home/index/upload', //仅为示例,非真实的接口地址
filePath: that.data.files\[0\],
name: 'file',
formData: {
'id': id
},
success: function (res) {
var data = res.data
// var json = JSON.parse(data)
console.log(data)
wx.showToast({
title: data,
icon:'success',
duration:2000
})
setTimeout(function () {
wx.navigateTo({
url: '../index/index',
})
}, 2000)
}
})
}
Page({
chooseImage: function (e) {
var that = this;
wx.chooseImage({
count: 1,
sizeType: \['original', 'compressed'\], // 可以指定是原图还是压缩图,默认二者都有
sourceType: \['album', 'camera'\], // 可以指定来源是相册还是相机,默认二者都有
success: function (res) {
console.log(res)
// 返回选定照片的本地文件路径列表,tempFilePath可以作为img标签的src属性显示图片
that.setData({
files: res.tempFilePaths,
});
}
})
},
//预览照片
previewImage: function () {
var current = e.target.dataset.src
wx.previewImage({
current: current,
urls: this.data.imageList
})
},
cancel:function(){
wx.redirectTo({
url: '../index/index',
})
},
/\*\*
\* 页面的初始数据
\*/
data: {
files: \[\],
options:null,
id:null,
},
formSubmit:function(e){
upload(this,this.data.id);
},
/\*\*
\* 生命周期函数--监听页面加载
\*/
onLoad: function (options) {
console.log(options);
this.setData({options:options})
this.setData({ id: options.id })
},
/\*\*
\* 生命周期函数--监听页面初次渲染完成
\*/
onReady: function () {
},
/\*\*
\* 生命周期函数--监听页面显示
\*/
onShow: function () {
},
/\*\*
\* 生命周期函数--监听页面隐藏
\*/
onHide: function () {
},
/\*\*
\* 生命周期函数--监听页面卸载
\*/
onUnload: function () {
},
/\*\*
\* 页面相关事件处理函数--监听用户下拉动作
\*/
onPullDownRefresh: function () {
},
/\*\*
\* 页面上拉触底事件的处理函数
\*/
onReachBottom: function () {
},
/\*\*
\* 用户点击右上角分享
\*/
onShareAppMessage: function () {
}
})
wxml代码如下: