Django 登錄注冊的實現(xiàn)示例
更新時間：2023年10月30日 11:14:04 作者：小熊Coding
本文主要介紹了Django 登錄注冊的實現(xiàn)示例,這是做網(wǎng)頁登錄和注冊基本上都是必要一步,具有一定的參考價值,感興趣的可以了解一下
最近在準(zhǔn)備上線一個網(wǎng)站（基于django的編程技術(shù)學(xué)習(xí)與外包服務(wù)網(wǎng)站），所以會將自己的在做這個項目的過程中遇到的模塊業(yè)務(wù)以及所涉及到的部分技術(shù)記錄在CSDN平臺里，一是希望可以幫到有需要的同學(xué)，二十以供自己后續(xù)回顧學(xué)習(xí)。
今天要分享的是django的登錄和注冊頁面功能，其實做網(wǎng)頁登錄和注冊基本上都是必要的一步啦，那么今天我們就來了解一下。
登錄注冊前端Html以及Css我就不細(xì)說啦，畢竟我主要是負(fù)責(zé)后端業(yè)務(wù)的，再說即使你我不會前端的內(nèi)容，網(wǎng)上一大堆的登錄注冊的模板，直接拿來下載就好了，我這個登陸注冊的前端模板就是直接在網(wǎng)站上Copy的，另外說到這個登錄注冊一般有兩種情況（1：登錄為一個頁面，注冊為一個頁面，2：登錄注冊同是在一個頁面）。
我先說一下在django框架里我們實現(xiàn)登錄注冊的一個大概流程：
拿到前端的模板，我們更據(jù)需要建立對應(yīng)的數(shù)據(jù)庫里的字段，然后回來前端來看，比如說我們點擊注冊，那么我們把注冊的按鈕的類型設(shè)置為submit，給每一個注冊頁面的輸入框設(shè)置一個name屬性，然后回到后端來看，在后端里，我們在函數(shù)中需要寫入判斷函數(shù)，如果是GET方法則返回注冊頁面，如果是POST方法（submit即提交表單），我們則會獲取我們輸入框的信息，然后我們將其存放在數(shù)據(jù)庫里即可，同時回到登錄頁面，然后輸入框輸入對應(yīng)的信息，如果輸入的信息（賬號和密碼）存在在數(shù)據(jù)庫里，則信息正確進(jìn)入我們的首頁（指定頁面）。
前端頁面如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>DjangoText</title>
<link rel="external nofollow" rel="stylesheet">
<script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.12.1/js/all.min.js"></script>
<link rel="stylesheet" rel="external nofollow" />
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js"></script>
<meta charset="utf-8">
<meta name="viewport"
content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no, minimal-ui, viewport-fit=cover">
<meta name="apple-mobile-web-app-capable" content="yes">
<link rel="stylesheet" rel="external nofollow" >
<link rel="stylesheet" rel="external nofollow" >
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<link rel="stylesheet" href="/static/css/loginstyle.css" rel="external nofollow" >
</head>
<body>
<!-- partial:index.partial.html -->
<body>
<div class="container">
<div class="content">
<div class="login-container animated fadeInDown" style="animation-delay:.3ms;">
<!-- Login -->
<div class="login justify-content-center" id="login-form">
<h1 class="form-title"><i class="fas fa-user" style="color:#55a0ff;"></i> <br> LOGIN
<hr>
</h1>
<div class="form-container animated fadeIn" style="animation-delay:.7ms;">
<form method="POST">{% csrf_token %}
<label for=""><i class="fas fa-at"></i> Email </label>
<input type="text" name="account" placeholder="Account">
<label for=""><i class="fab fa-slack-hash"></i> Password </label>
<input type="password" name="password" placeholder="Password">
<div class="submit-buttons">
<input type="submit" value="登錄" name="loginsubmit">
<input type="button" value="注冊" class="btn-register">
</div>
</form>
</div>
</div>
<!-- Login -->
<!-- Register -->
<div class="register justify-content-cente animatedr" style="animation-delay:.3s">
<h1 class="form-title "><i class="fas fa-user-plus" style="color:#57efc4;"></i> <br> REGISTER
<hr>
</h1>
<div class="form-container animated fadeIn" style="animation-delay:.3s;">
<form method="POST" action="/login/" >{% csrf_token %}
<label for=""><i class="fab fa-amilia"></i> Name </label>
<input type="text" name="name" placeholder="Name">
<label for=""><i class="fas fa-at"></i> Account </label>
<input type="text" name="account" placeholder="Account">
<label for=""><i class="fab fa-slack-hash"></i> Password </label>
<input type="password" name="password" placeholder="Password">
<label for=""><i class="fab fa-slack-hash"></i> Confirm Password </label>
<input type="password" name="password_confirmation" placeholder="Password">
<div class="submit-buttons">
<input type="submit" name="registersubmit" value="注冊" style="background:#55efc4;">
<input type="button" value="登錄" class="btn-login">
</div>
</form>
</div>
</div>
<!-- Register -->
<div class="login animated fadeIn" style="animation-delay:.7s;animation-duration:4s;" id="login-bg"></div>
</div>
</div>
</div>
</body>
<!-- partial -->
<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/fontawesome-iconpicker/3.2.0/js/fontawesome-iconpicker.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/css/bootstrap.min.css'></script>
<script src="/static/js/loginscript.js"></script>
</body>
</html>
自定義404報錯頁面：
<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<title>404 Page</title>
<link rel="stylesheet" href="/static/css/style_error.css" rel="external nofollow" >
</head>
<body>
<section class="wrapper">
<div class="container">
<div id="scene" class="scene" data-hover-only="false">
<div class="circle" data-depth="1.2"></div>
<div class="one" data-depth="0.9">
<div class="content">
<span class="piece"></span>
<span class="piece"></span>
<span class="piece"></span>
</div>
</div>
<div class="two" data-depth="0.60">
<div class="content">
<span class="piece"></span>
<span class="piece"></span>
<span class="piece"></span>
</div>
</div>
<div class="three" data-depth="0.40">
<div class="content">
<span class="piece"></span>
<span class="piece"></span>
<span class="piece"></span>
</div>
</div>
<p class="p404" data-depth="0.50">Error</p>
<p class="p404" data-depth="0.10">Error</p>
</div>
<div class="text">
<article>
<p>{{ errorMsg }}</p>
<button id="back">返回首頁</button>
</article>
</div>
</div>
</section>
<script src='/static/js/parallax.min.js'></script>
<script src='/static/js/jquery.min.js'></script>
<script src="/static/js/script.js"></script>
<script>
var back = document.getElementById('back');
back.onclick = function(e){
history.back()
}
</script>
</body>
</html>后端業(yè)務(wù)處理代碼如下：
def login(request):
if request.method == "GET":
return render(request,'login.html')
elif request.POST.get('registersubmit'):
print('nihao 注冊')
name = request.POST.get('name')
account = request.POST.get('account')
password = request.POST.get('password')
checkpassword = request.POST.get('password_confirmation')
try:
User.objects.get(account=account)
except:
if not name or not account or not password or not checkpassword:
return errorResponse(request, '定義技術(shù)：昵稱or賬號or密碼存在空值')
if password != checkpassword:
return errorResponse(request, '定義技術(shù)：兩次密碼不吻合')
User.objects.create(name=name, account=account, password=password, checkpassword=checkpassword)
return render(request,"login.html")
elif request.POST.get('loginsubmit'):
print('nihao 登錄')
account1 = request.POST.get('account')
password1 = request.POST.get('password')
try:
User.objects.get(account=account1,password=password1)
except:
return errorResponse(request,'定義技術(shù)：輸入信息有誤')數(shù)據(jù)庫：
from django.db import models
class User(models.Model):
name=models.CharField(verbose_name='昵稱',max_length=30)
account=models.CharField(verbose_name='賬號',max_length=30)
password=models.CharField(verbose_name='密碼',max_length=30)
checkpassword=models.CharField(verbose_name='確認(rèn)密碼',max_length=30)效果圖：
自定義404報錯頁面：
另外說一下，我這個前端的登陸注冊頁面是在一個外網(wǎng)Copy下載的，且登陸注冊的右側(cè)的那個圖片是你每次登錄注冊都會隨機(jī)生成不同的圖片，所以加載的時候可能會出現(xiàn)慢的情況。
到此這篇關(guān)于Django 登錄注冊的實現(xiàn)示例的文章就介紹到這了,更多相關(guān)Django 登錄注冊內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
您可能感興趣的文章:
- django如何實現(xiàn)用戶的注冊、登錄、注銷功能
- django authentication 登錄注冊的實現(xiàn)示例
- Python基于Django實現(xiàn)驗證碼登錄功能
- 利用django和mysql實現(xiàn)一個簡單的web登錄頁面
- Django通過自定義認(rèn)證后端實現(xiàn)多種登錄方式驗證
- Django實現(xiàn)簡單登錄的示例代碼
- Django實現(xiàn)前后端登錄
- Django中使用pillow實現(xiàn)登錄驗證碼功能(帶刷新驗證碼功能)
- 給Django Admin添加驗證碼和多次登錄嘗試限制的實現(xiàn)
- 使用Tastypie登錄Django的問題解決
相關(guān)文章
這篇文章主要介紹了如何在 Python 中注釋，幫助其他開發(fā)者理解你的代碼，以及代碼的目的。感興趣的朋友可以了解下2020-08-08
python django事務(wù)transaction源碼分析詳解
這篇文章主要介紹了python django事務(wù)transaction源碼分析詳解的相關(guān)資料,需要的朋友可以參考下2017-03-03
強(qiáng)烈推薦好用的python庫合集(全面總結(jié))
這篇文章主要為大家介紹了強(qiáng)烈推薦非常好用的python庫合集(全面總結(jié))，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-05-05
這篇文章主要介紹了Python?變量類型實例詳解，基于變量的數(shù)據(jù)類型，解釋器會分配指定內(nèi)存，并決定什么數(shù)據(jù)可以被存儲在內(nèi)存中，接下來更多詳細(xì)內(nèi)容需要的小伙伴可以參考下面文章，希望對你有所幫助2022-02-02
這篇文章主要介紹了python實現(xiàn)無證書加密解密的方法,實例講述了無證書加密解密的原理與具體實現(xiàn)過程,非常具有實用價值,需要的朋友可以參考下2014-10-10
django生產(chǎn)環(huán)境搭建(uWSGI+django+nginx+python+MySQL)
本文主要介紹了django生產(chǎn)環(huán)境搭建，主要包括uWSGI+django+nginx+python+MySQL，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-08-08
Django REST framework 單元測試實例解析
這篇文章主要介紹了Django REST framework 單元測試實例解析,文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下2019-11-11
python 爬取古詩文存入mysql數(shù)據(jù)庫的方法
這篇文章主要介紹了python 爬取古詩文存入mysql數(shù)據(jù)庫的方法，本文通過實例代碼給大家介紹的非常詳細(xì)，具有一定的參考借鑒價值,需要的朋友可以參考下2020-01-01
Python開發(fā)工具Pycharm的安裝以及使用步驟總結(jié)
今天給大家?guī)淼氖顷P(guān)于Python開發(fā)工具的安裝以及使用的相關(guān)知識,文章圍繞著如何使用和安裝Pycharm展開,文中有非常詳細(xì)的介紹及代碼示例,需要的朋友可以參考下2021-06-06
python使用cStringIO實現(xiàn)臨時內(nèi)存文件訪問的方法
這篇文章主要介紹了python使用cStringIO實現(xiàn)臨時內(nèi)存文件訪問的方法,涉及Python使用cStringIO模塊操作內(nèi)存的技巧,需要的朋友可以參考下2015-03-03