首先给上自己开发的网站demo： 点击打开链接

首先是思路，face++要求获取图片的URL，因此

首先将前端上传的文件直接上传到云数据库（无需通过后台），我使用的是bmob云数据库，如何使用bmob请到官网查阅文档，很简单的

使用bmob记得要初始化，我这里就不贴了，直接贴获取url的代码

javascript">function uploadBmob(){
	  $("#loading").show();
      var fileUploadControl = $("#fileElem")[0]; 
      if (fileUploadControl.files.length > 0) {
        var file = fileUploadControl.files[0];  //将文件赋值给file
        var name = "face.jpg";   //保存后的文件名，随便取
        var file = new Bmob.File2(name, file);   //将文件上传至云
        file.save().then(function(obj) {
		 var url=obj.url();   //就这么简单的就获取到了图片的URL
	     getFaceInfo(url);  
       }, function(error) {
  // the save failed.
      alert("不好意思，服务器大姨妈，图片无法取得url");
	  document.getElementById("pleasewait").innerHTML="<p class='text-danger' >    图片信息获取失败！</p>";
      });
	  }

    }

接着要通过url，就能获取人脸信息

javascript">function  getFaceInfo(urlstr){   //urlstr 为图片url
 var api = new FacePP('xxxxxxxxxxxxxxx', 'xxxxxxxxxxxxxxx');  //此处改成你face++项目的
 api.request('detection/detect', {
      url:urlstr,     
      attribute:"glass,pose,gender,age,race,smiling"   //这样才能获取glass和pose的信息
    }, function(err, result) {
     if (err) {
      // TODO handle error
	   alert("人脸云端识别出错，请重试！");
	         return;  
      }
        // TODO 2.use result
	   var json= JSON.stringify(result, null, 2);
	   getwuguan(json); //获取五官信息
	   
	   document.getElementById("pleasewait").innerHTML="<p class='text-success' >    图片上传成功！</p>";
  });
}

最后就是解析json，我也贴上吧

javascript">function getwuguan(json){
   alert(json);
   var obj = eval ("(" + json + ")");   //解析json

javascript">   //下面的代码是我自己的项目如何使用变量的，做个例子
   facenum=obj.face.length;
   if(facenum>1)     //检测到多张脸，弹出提示
   $('#lianbuqiehuan').popover('show');
   var H=document.getElementById("myCanvas").height*0.01;
   var W=document.getElementById("myCanvas").width*0.01;
   for(var i=0;i<facenum;i++){
	   faceID[i]=obj.face[i].face_id;
	   facecenterX[i]=obj.face[i].position.center.x*W;
	   facecenterY[i]=obj.face[i].position.center.y*H;
	   facewidth[i]=obj.face[i].position.width*W;
	   faceheight[i]=obj.face[i].position.height*H;
       lefteyeX[i]=obj.face[i].position.eye_left.x*W;
	   lefteyeY[i]=obj.face[i].position.eye_left.y*H;
	   righteyeX[i]=obj.face[i].position.eye_right.x*W;
	   righteyeY[i]=obj.face[i].position.eye_right.y*H;
	   noseX[i]=obj.face[i].position.nose.x*W;
	   noseY[i]=obj.face[i].position.nose.y*H;
	   leftmouthX[i]=obj.face[i].position.mouth_left.x*W;
       leftmouthY[i]=obj.face[i].position.mouth_left.y*H;
       rightmouthX[i]=obj.face[i].position.mouth_right.x*W;
	   rightmouthY[i]=obj.face[i].position.mouth_right.y*H;
	   age_value[i]=obj.face[i].attribute.age.value;
	   age_range[i]=obj.face[i].attribute.age.range;
	   gender_value[i]=obj.face[i].attribute.gender.value;
	   gender_confidence[i]=obj.face[i].attribute.gender.confidence;
	  /* glass_value[i]=obj.face[i].attribute.glass.value;
	   glass_confidence[i]=obj.face[i].attribute.glass.confidence;*/
	   race_value[i]=obj.face[i].attribute.race.value;
	   race_confidence[i]=obj.face[i].attribute.race.confidence;
       smiling_value[i]=obj.face[i].attribute.smiling.value;
    //   pitch_angle[i]=obj.face[i].attribute.pose.pitch_angle;

	   facecenterY[i]+=faceheight[i]*0.05;
   }
  // obj.face[0].position.eye_left.x
}

有疑问请留言，不定期上博客回复