Django調(diào)用百度AI接口實現(xiàn)人臉注冊登錄代碼實例
更新時間：2020年04月23日 08:41:14 作者：小陸同學
這篇文章主要介紹了Django調(diào)用百度AI接口實現(xiàn)人臉注冊登錄,文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下
面部識別----考勤打卡、注冊登錄、面部支付等等...感覺很高大上，又很方便，下面用python中的框架--django完成一個注冊登錄的功能，調(diào)用百度AI的接口，面部識別在網(wǎng)上也有好多教程，可以自己建模，訓練模型，但是這都需要大量的數(shù)據(jù)去提高模型的準確度，我們直接用了百度AI的接口，十分的快捷、高效、準確，下來碼一下代碼啦！！
首先需要在百度AI官網(wǎng)注冊一個應用，免費，并提供強大的人臉庫。
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.注冊時調(diào)用攝像頭，ajax封裝給后端的數(shù)據(jù)
<!-- 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 () {
// 老的瀏覽器可能根本沒有實現(xiàn) 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;
// 一些瀏覽器根本沒實現(xiàn)它 - 那么就返回一個error到promise的reject來保持一個統(tǒng)一的接口
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 {
// 防止再新的瀏覽器里使用它，應為它已經(jīng)不再支持了
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);
// 圖片數(shù)據(jù)轉(zhuǎn)換成數(shù)組
data = mycanvas.toDataURL('image/webp');
document.getElementById('photo').setAttribute('src', data);
// ajax提交數(shù)據(jù)到后臺
$.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.
}else{
alert(data.result);
}
}
})
}
}, false);
3.將已經(jīng)注冊的應用中的各種id和key貼上來
# 導入百度AI from django.apps import AppConfig from aip import AipFace import json # django內(nèi)置事務 from django.db import transaction # 導入狀態(tài)碼 from jyapp.ErrorCode import * # 官網(wǎng)給出的狀態(tài)碼，通過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.注冊接口，按照接口文檔傳入必須的參數(shù)，手機驗證碼功能已在本文中注釋掉，需要時自行百度。
# 注冊
class Regist(View):
def get(self,request):
return render(request,'moban_index.html')
def post(self,request):
# 獲取前端數(shù)據(jù)
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數(shù)據(jù)庫
models.User.objects.create(
imagecontent = 'static/image/'+mobile+'.jpeg', # 可以根據(jù)需求是否保存注冊照片到數(shù)據(jù)庫，也可以通過百度AI人臉庫查看
username = username,
mobile = mobile,
password = password,
)
imageType = 'BASE64'
groupId = 'usergroup' # 自定義
userId = mobile
# 加入可選參數(shù)
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.
}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'
# 加入可選參數(shù)
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)})
以上就是本文的全部內(nèi)容，希望對大家的學習有所幫助，也希望大家多多支持腳本之家。
相關文章
通過?for?循環(huán)比較?Python?與?Ruby?的編程區(qū)別
這篇文章主要介紹了通過?for?循環(huán)比較?Python?與?Ruby?的編程區(qū)別，Ruby?與?Python?之間的差異在很大程度上可通過for循環(huán)看出本質(zhì),下文詳細介紹需要的小伙伴可以參考一下2022-05-05
這篇文章主要介紹了Python爬蟲之爬取淘女郎照片示例詳解，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2020-07-07
今天小編就為大家分享一篇Python編寫帶選項的命令行程序方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2019-08-08
這篇文章主要介紹了Python編程之event對象的用法,結合實例形式分析了event對象在線程通信中的作用與使用方法,需要的朋友可以參考下2017-03-03
python實現(xiàn)類似ftp傳輸文件的網(wǎng)絡程序示例
這篇文章主要介紹了python實現(xiàn)類似ftp傳輸文件的網(wǎng)絡程序示例,需要的朋友可以參考下2014-04-04
今天小編就為大家分享一篇Opencv+Python 色彩通道拆分及合并的示例，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-12-12
這篇文章主要介紹了python如何制作自己的模塊,本文通過實例代碼給大家介紹的非常詳細，對大家的學習或工作具有一定的參考借鑒價值，需要的朋友可以參考下2023-08-08
手把手教你快速安裝gpu版本的pytorch(詳細圖文教程)
在Windows?10上安裝PyTorch時,通常默認安裝的是CPU版本,且下載速度較慢,本文提供了一個詳細的安裝指南,包括如何檢查CUDA版本、選擇合適的PyTorch、torchvision和torchaudio版本,并通過pip而非conda進行安裝,文中通過圖文介紹的非常詳細,需要的朋友可以參考下2024-09-09
最近在開發(fā)一款自動化的應用,但是,在測試時,卻發(fā)現(xiàn)了問題,當我點擊暫停任務后,此時子線程被阻塞,如果我這個時候點擊停止,那么就會任務結束,之后,如果我再點擊開始運行,整個應用就會卡死,所以本文介紹了Python應用開發(fā)頻繁假死的問題分析及解決,需要的朋友可以參考下2024-08-08
python中reversed與reverse的區(qū)別解析
reverse()是python中列表的一個內(nèi)置方法(在字典、字符串和元組中沒有這個內(nèi)置方法)，用于列表中數(shù)據(jù)的反轉(zhuǎn)，這篇文章主要介紹了python中reversed與reverse的區(qū)別,需要的朋友可以參考下2023-03-03