小程序實現人臉識別功能

接入流程前端

1.

按照文檔獲取AppID、API Key、Secret Key,進行Access Token(用戶身份驗證和受權的憑證)的生成express

const getBaiduToken = function () {
 return new Promise((resolve, reject) => {
  //自行獲取APIKey、SecretKey
  const apiKey = APIKey;
  const secKey = SecretKey;
  const tokenUrl = `https://aip.baidubce.com/oauth/2.0/token?grant_type=client_credentials&client_id=${apiKey}&client_secret=${secKey}`;
  wx.request({
   url: tokenUrl,
   method: 'POST',
   dataType: "json",
   header: {
    'content-type': 'application/json; charset=UTF-8'
   },
歡迎加入全棧開發交流划水交流圈:582735936
面向划水1-3年前端人員
幫助突破划水瓶頸,提高思惟能力
   success: function (res) {
    resolve(res);
   },
   fail: function (res) {
    wx.hideLoading();
    wx.showToast({
     title: '網絡錯誤,請重試!',
     icon: 'none',
     duration: 2000
    })
    reject(res);
   },
   complete: function (res) {
    resolve(res);
   }
  })
 })
}

2.

選擇人臉識別-->人臉檢測,人臉識別接口分爲V2和V3兩個版本,確認在百度雲後臺得到的是V2仍是v3版本接口權限。
//封裝識別方法json

const getImgIdentify = function(tokenUrl, data){
 return new Promise((resolve, reject) => {
  const detectUrl = `https://aip.baidubce.com/rest/2.0/face/v3/detect?access_token=${tokenUrl}`;
  wx.request({
   url: detectUrl,
   data: data,
   method: 'POST',
   dataType: "json",
   header: {
    'content-type': 'Content-Type:application/json; charset=UTF-8'
   },
   success: function (res) {
    resolve(res);
   },
   fail: function (res) {
    wx.hideLoading();
    wx.showToast({
     title: '網絡錯誤,請重試!',
     icon: 'none',
     duration: 2000
    })
歡迎加入全棧開發交流划水交流圈:582735936
面向划水1-3年前端人員
幫助突破划水瓶頸,提高思惟能力
    reject(res);
   },
   complete: function (res) {
    resolve(res);
   }
  })
 })
}

3.

調用識別方法api

getBaiduToken().then((res) => {
 let token = res.data.access_token;
 let data = {
  "image": self.data.img,
  "image_type":"URL",
  "face_field":"ge,beauty,expression,face_shape,gender,glasses,landmark,race,quality,eye_status,emotion,face_type"
 }
 util.getImgIdentify(token, data).then((res)=>{
  //百度接口返回的結果
  let score = parseInt(res.data.result.face_list[0].beauty);
  self.setData({
   score: score,
  })
 })
})

4.

結果以下:
網絡

相關文章
相關標籤/搜索