Django调用百度AI接口实现人脸注册登录代码实例

面部识别----考勤打卡、注册登录、面部支付等等...感觉很高大上，又很方便，下面用python中的框架--django完成一个注册登录的功能，调用百度AI的接口，面部识别在网上也有好多教程，可以自己建模，训练模型，但是这都需要大量的数据去提高模型的准确度，我们直接用了百度AI的接口，十分的快捷、高效、准确，下来码一下代码啦！！

首先需要在百度AI官网注册一个应用，免费，并提供强大的人脸库。

1.注册表单

<div class="tab-content">
                   <div class="tab-content-inner active" data-content="signup">
                     <!-- <form action="{％ url 'regist' ％}" method="POST"> -->
                       <div class="row form-group">
                         <div class="col-md-12">
                           <input type="text" class="form-control" id="username" placeholder="用户名">
                         </div>
                       </div>
                       <div class="row form-group">
                         <div class="col-md-12">
                           <input type="text" class="form-control" id="mobile" placeholder="手机号">
                         </div>
                       </div>
                       <div class="row form-group">
                         <div class="col-md-12">
                           <input type="password" class="form-control" id="password" placeholder="密码">
                         </div>
                       </div>
                       <div class="row form-group">
                           <div class="col-md-12">
                             <!-- <input type="text" class="form-control" id="mobile_code" placeholder="验证码">
                             <input type="button" value=" 获取验证码" id="zphone"> -->
                           </div>
                       </div>
                       <div class="row form-group">
                         <div class="col-md-12">
                           <label for="password2"><font color='green'>新用户点击注册会有面部特征收集哦！</font></label>
                         </div>
                       </div>

<div class="row form-group">
                         <div class="col-md-12">
                           <input type="submit" class="btn btn-primary" value="注册" id="regist">
                         </div>
                       </div>
                     <!-- </form>   -->
                   </div>

2.注册时调用摄像头，ajax封装给后端的数据

<!-- jQuery -->
 <script src="../static/assets/js/jquery.min.js"></script>
 <!-- jQuery Easing -->
 <script src="../static/assets/js/jquery.easing.1.3.js"></script>
 <!-- Bootstrap -->
 <script src="../static/assets/js/bootstrap.min.js"></script>
 <!-- Waypoints -->
 <script src="../static/assets/js/jquery.waypoints.min.js"></script>
 <!-- Carousel -->
 <script src="../static/assets/js/owl.carousel.min.js"></script>
 <!-- countTo -->
 <script src="../static/assets/js/jquery.countTo.js"></script>
 <!-- Magnific Popup -->
 <script src="../static/assets/js/jquery.magnific-popup.min.js"></script>
 <script src="../static/assets/js/magnific-popup-options.js"></script>
 <!-- Main -->
 <script src="../static/assets/js/main.js"></script>

<script>
   !(function () {
     // 老的浏览器可能根本没有实现 mediaDevices，所以我们可以先设置一个空的对象
     if (navigator.mediaDevices === undefined) {
       navigator.mediaDevices = {};
     }
     if (navigator.mediaDevices.getUserMedia === undefined) {
       navigator.mediaDevices.getUserMedia = function (constraints) {
         // 首先，如果有getUserMedia的话，就获得它
         var getUserMedia = navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia;

// 一些浏览器根本没实现它 - 那么就返回一个error到promise的reject来保持一个统一的接口
         if (!getUserMedia) {
           return Promise.reject(new Error('getUserMedia is not implemented in this browser'));
         }

// 否则，为老的navigator.getUserMedia方法包裹一个Promise
         return new Promise(function (resolve, reject) {
           getUserMedia.call(navigator, constraints, resolve, reject);
         });
       }
     }
     const constraints = {
       video: true,
       audio: false
     };
     videoPlaying = false;
     v = document.getElementById('v');
     promise = navigator.mediaDevices.getUserMedia(constraints);
     promise.then(stream => {
       // 旧的浏览器可能没有srcObject
       if ("srcObject" in v) {
         v.srcObject = stream;
       } else {
         // 防止再新的浏览器里使用它，应为它已经不再支持了
         v.src = window.URL.createObjectURL(stream);
       }
       v.onloadedmetadata = function (e) {
         v.play();
         videoPlaying = true;
       };
     }).catch(err => {
       console.error(err.name + ": " + err.message);
     })
     document.getElementById('regist').addEventListener('click', function () {
       if (videoPlaying) {
         mycanvas = document.getElementById('canvas');
         mycanvas.width = v.videoWidth;
         mycanvas.height = v.videoHeight;
         mycanvas.getContext('2d').drawImage(v, 0, 0);
         // 图片数据转换成数组
         data = mycanvas.toDataURL('image/webp');
         document.getElementById('photo').setAttribute('src', data);
         // ajax提交数据到后台
         $.ajax({
           type:"POST",
           url:'http://127.0.0.1:8000/regist/',
           data:{username:$("#username").val(),mobile:$('#mobile').val(),password:$('#password').val(),mobile_code:$('#mobile_code').val(),imagecontent:data},
           dataType:"json",
           success:function(data){
             alert(data.result)
             $('#resText').text(data['result']);
             if(data.code == 200){
               window.location.href='http://127.0.0.1:8000/home/'
             }else{
               alert(data.result);
             }
           }
         })
       }
     }, false);

3.将已经注册的应用中的各种id和key贴上来

# 导入百度AI
from django.apps import AppConfig
from aip import AipFace
import json
# django内置事务
from django.db import transaction
# 导入状态码
from jyapp.ErrorCode import * # 官网给出的状态码，通过pandas读出保存到

# 百度AI基本信息
class AppConfig(AppConfig):
 name = ''
 APP_ID = ''
 API_KEY = ''
 SECRECT_KEY = ''
 client = AipFace(APP_ID,API_KEY,SECRECT_KEY)
 client.setConnectionTimeoutInMillis(1000*5)
 client.setSocketTimeoutInMillis(1000*5)

4.注册接口，按照接口文档传入必须的参数，手机验证码功能已在本文中注释掉，需要时自行百度。

# 注册
class Regist(View):
 def get(self,request):
   return render(request,'moban_index.html')
 def post(self,request):
   # 获取前端数据
   imagecontent = request.POST.get('imagecontent')
   username = request.POST.get('username')
   mobile = request.POST.get('mobile')
   password = request.POST.get('password')
   # mobile_code = request.POST.get('mobile_code')
   # print(imagecontent,username,mobile,password,mobile_code)
   # mobile_code_right = request.session.get('message_code')
   if not all([imagecontent,username,mobile,password]):
     return JsonResponse({'result':'注册信息不能为空'})
   # if mobile_code != mobile_code_right:
   #   return JsonResponse({'result':'请输入正确的验证码'})
   else:
     # 验证该用户是否存在
     user = models.User.objects.filter(mobile=mobile)
     if user:
       return JsonResponse({'result':'该用户已存在，请直接登录'})
     else:
       try:
         # 引入事务
         with transaction.atomic():  
           # 分割字符串
           base_data = imagecontent.split(',')[1]
           # base64解码
           base64_decode = base64.b64decode(base_data)
           # 图片写入本地
           with open('static/image/'+mobile+'.jpeg', 'wb') as f:
             f.write(base64_decode)
           # 添加到mysql数据库
           models.User.objects.create(
             imagecontent = 'static/image/'+mobile+'.jpeg',  # 可以根据需求是否保存注册照片到数据库，也可以通过百度AI人脸库查看
             username = username,
             mobile = mobile,
             password = password,
           )
           imageType = 'BASE64'
           groupId = 'usergroup'  # 自定义
           userId = mobile
           # 加入可选参数
           options = {}
           options['user_info'] = username
           options['quality_control'] = 'NORMAL'
           options['liveness_control'] = 'LOW'
           result = AppConfig.client.addUser(base_data,imageType,groupId,userId,options)
           print(result)
           error_code = result['error_code']
           if isinstance(error_code,int) and error_code == 0:
             request.session['mobile'] = mobile
             return JsonResponse({'code':200,'result':'注册成功'})
             # return JsonResponse({'result':'注册成功'})
           else:
             error = ErrorCode().getErrorInfo(error_code)
             return JsonResponse({'result':'{}'.format(error)})
       except:
         return JsonResponse({'result':'注册失败'})

5.登录.html

<div class="tab-content-inner" data-content="login">
                     <!-- <form action="{％ url 'login' ％}" method="POST"> -->
                       <div class="row form-group">
                         <div class="col-md-12">
                           <input type="text" class="form-control" id="mobile1" placeholder="请输入手机号">
                         </div>
                       </div>
                       <div class="row form-group">
                         <div class="col-md-12">
                           <input type="password" class="form-control" id="password1" placeholder="请输入密码">
                         </div>
                       </div>

<div class="row form-group">
                         <div class="col-md-12">
                           <input type="submit" class="btn btn-primary" value="密码登陆" id="login">
                           <input type="submit" class="btn btn-primary" value="人脸登陆" id="login_face">
                         </div>
                       </div>
                     <!-- </form>   -->
                   </div>

6.ajax封装登录信息

document.getElementById('login_face').addEventListener('click', function () {
       if (videoPlaying) {
         mycanvas = document.getElementById('canvas');
         mycanvas.width = v.videoWidth;
         mycanvas.height = v.videoHeight;
         mycanvas.getContext('2d').drawImage(v, 0, 0);
         data = mycanvas.toDataURL('image/webp');
         document.getElementById('photo').setAttribute('src', data);

$.ajax({
           type:"POST",
           url:'http://127.0.0.1:8000/login_face/',
           data:{mobile:$('#mobile1').val(),imagecontent:data},
           dataType:"json",
           success:function(data){
             $('#resText').text(data['result']);
             document.getElementById('photo').setAttribute('src','static/'+data['point72src']);
             console.log(data['point72src'])
             if(data.code == 200){
               alert(data.result)
               window.location.href='http://127.0.0.1:8000/idcard/'
             }else{
               alert(data.result);
             }
           }
         })
       }
     }, false);

7.人脸快速登录

class Login_face(View):
 def get(self,request):
   return render(request,'moban_index.html')
 def post(self,request):
   imagecontent = request.POST.get('imagecontent')
   mobile = request.POST.get('mobile')
   if not all([imagecontent,mobile]):
     return JsonResponse({'code':100,'result':'登录信息不能为空'})
   else:
     user = models.User.objects.filter(mobile=mobile)
     if not user:
       return JsonResponse({'code':113,'result':'用户不存在'})
     else:
       base_data = imagecontent.split(',')[1]
       imageType = 'BASE64'
       groupIdList = 'usergroup'
       # 加入可选参数
       options = {}
       options['max_user_num'] = 1
       options['quality_control'] = 'NORMAL'
       options['liveness_control'] = 'LOW'
       # options['user_id'] = mobile
       result = AppConfig.client.search(base_data,imageType,groupIdList,options)
       print(result)
       error_code = result['error_code']
       try:
         user_id = result['result']['user_list'][0]['user_id']
         score = result['result']['user_list'][0]['score']
         if isinstance(error_code,int) and error_code == 0 and user_id == mobile and score >= 90:
           request.session['mobile'] = mobile
           return JsonResponse({'code':200,'result':'快速登录成功'})
         else:
           error = ErrorCode().getErrorInfo(error_code)
           return JsonResponse({'result':'{}'.format(error)})
       except:
         error = ErrorCode().getErrorInfo(error_code)
         return JsonResponse({'result':'{}'.format(error)})

来源：https://www.cnblogs.com/lutt/p/11093974.html