摘要:在導航條中,右側有登錄和注冊兩個鏈接,儲存用戶數據的模型也有了,現在我們來實現登錄和注冊的功能。
在導航條中,右側有登錄和注冊兩個鏈接,儲存用戶數據的Users模型也有了,現在我們來實現登錄和注冊的功能。
先來看注冊功能的實現,新建一個視圖函數,如下:
@app.route("/register/") def register(): return render_template("register.html")
在導航條模板base.html中,為注冊添加鏈接,使用url_for函數將其href屬性值修改為register.html,如下:
接下來我們要去制作register.html了,這部分是基礎的html/css知識,控件也是用的Bootstrap框架,最終注冊頁http://127.0.0.1:5000/register/的效果圖如下(結尾貼出代碼):
register.html中的表單控件,我們設置了其方法為POST,注冊按鈕的type為submit,這樣點擊提交按鈕的時候,瀏覽器就會以POST方法去請求當前網址,但我們的視圖函數默認只能接受GET方法,因此我們要為其添加POST方法,并使用flask中的request對象獲取表單提交的數據,最終視圖函數代碼如下:
@app.route("/register/", methods=["GET", "POST"]) def register(): if request.method == "GET": return render_template("register.html") else: username = request.form.get("username") password1 = request.form.get("password1") password2 = request.form.get("password2") print(username, password1, password2) return " "
request.form.get方法需要傳入表單控件的name屬性的值,這樣就能獲取到對應的填入到表單中的值了,為了演示,我們在結尾將其打印了出來,結果顯示無誤,說明后端已經獲取到了POST提交的數據。
登陸頁面也是一樣的原理,拿register.html簡單修改成login.html,模仿register再增加一個login視圖函數,然后訪問http://127.0.0.1:5000/login/,效果如下:
結尾貼上register.html的內容:
{% extends "base.html" %} {% block static_files %} {% endblock %} {% block page_name %}注冊{% endblock %} {% block body_part %}{% endblock %}注冊
代碼中引入的register_login.css是register.html和login.html通用的,其內容如下:
h3{ text-align: center; padding-top: 10px; } .form{ width: 400px; margin: 0 auto; } form.form > div{ padding: 8px; }
此外還對導航條模板做了簡單的調整,第一是增加了一個block,給每個繼承它的html一個放自定義css文件的地方,第二是在body中增加了一個div塊,即register.html和login.html中間白色的內容區域,最終base.html代碼如下:
{% block static_files %}{% endblock %}{% block page_name %}{% endblock %}-HarpQA {% block body_part %} {% endblock %}
base.css也添加了 文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。 轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/41250.html.body-container{
width: 600px;
background: white;
margin: 0 auto;
border-radius: 5px;
}
摘要:前端渲染可以減輕服務器端的開銷,但是首屏的渲染會加長時間后端渲染增加服務器的開銷,但是減少客戶端展示的時間 1 注冊、登錄和退出 1.1 用戶注冊、登錄 配置模板引擎、mongoDB數據庫驅動、靜態文件路徑和post請求解析中間件 統一api.js路由的數據返回格式 // 統一返回數據格式 var responseData; // 每次請求進來都進行初始化 router.use(f...
摘要:本文講解的就是授權登錄的教程。從拿到的用戶信息如下圖最終效果參與文章如何設計第三方授權登錄的用戶表第三方授權登錄的時候,第三方的用戶信息是存數據庫原有的表還是新建一張表呢答案這得看具體項目了,做法多種,請看下文。 showImg(https://segmentfault.com/img/remote/1460000018372844?w=1210&h=828); 需求:在網站上想評論一...
摘要:上面的寫法有個問題點擊按鈕發送請求后,客戶端一直收不到響應,就會報錯其實傳送的時是一個異步的過程,里面還沒執行完,外面就已經執行了,這邊可以用來解決下這個問題內部返回一個對象,成功調用函數,失敗調用函數,這邊就默認它會成功。 今天來研究一個小小的功能。當我們進入一個網站,它怎么判斷我是不是它的用戶?讓用戶登錄唄,如果它能正常登錄,它就是我的用戶唄?你有沒想過它是怎么判斷我是不是它用戶的...
摘要:通過的定制字段的輸入小部件,將文本框的寬度設置為列,而不是默認的列。為此將創建一個新的應用程序,其中包含處理用戶賬戶相關的所有功能。該函數將會為通過了身份驗證的用戶對象創建會話。 《Python編程:從入門到實踐》筆記。本篇記錄如何創建用戶注冊系統,如何實現用戶輸入自己的數據。 1. 前言 在本篇中,我們將: 創建一些表單,讓用戶能夠添加主題和條目,以及編輯既有的條目; 實現一個身份...
閱讀 1802·2021-11-24 09:39
閱讀 2290·2021-09-30 09:47
閱讀 4144·2021-09-22 15:57
閱讀 1873·2019-08-29 18:36
閱讀 3577·2019-08-29 12:21
閱讀 590·2019-08-29 12:17
閱讀 1263·2019-08-29 11:25
閱讀 724·2019-08-28 18:26