1. 程式人生 > 其它 >DAY8 首頁登入功能的實現

DAY8 首頁登入功能的實現

當我們完成使用者註冊,往專案的MySQL資料庫添加了使用者資料之後就可以進行對

使用者登入功能的實現了

前端HTML程式碼的實現

// 發起登入請求
        var params = {
            'mobile':mobile,
            'password':password
        };

        $.ajax({
            url:'/passport/login',
            type:'post',
            data:JSON.stringify(params),
            contentType:'application/json',
            headers:{'X-CSRFToken':getCookie('csrf_token')}, // 在請求頭中帶上csrf_token
            success:function (response) {
                if (response.errno == '0') {
                    // 登入成功後重新整理當前介面
                    location.reload();
                } else {
                    alert(response.errmsg);
                }
            }
        });

將上面的程式碼複製到對應的程式碼塊,和註冊時一樣全選然後貼上覆蓋住,對應程式碼塊的進入前面有就不寫了

前端知識補充

這樣前端的程式碼就處理了,這裡簡單講解一下jquery中的ajax(區域性刷新技術)

ajax是一種無需再重新載入整個網頁的情況下,能夠更新部分網頁的技術,它必要的引數為

URL :要求為String型別的引數,(預設為當前頁地址)傳送請求的地址。

type:要求為String型別的引數,請求方式(post或get)預設為get。注意其他http請求方法,例如put和delete也可以使用,但僅部分瀏覽器支援。

success(回撥函式):

要求為Function型別的引數,請求成功後呼叫的回撥函式,有兩個引數。
(1)由伺服器返回,並根據dataType引數進行處理後的資料。
(2)描述狀態的字串。
function(data, textStatus){
//data可能是xmlDoc、jsonObj、html、text等等
this; //呼叫本次ajax請求時傳遞的options引數
}

後端程式碼的編寫

登入功能也遵循了下圖的介面規範,按照下圖的規範進行相關程式碼的編寫

首先建立對應的登入檢視

實現登入功能的檢視函式是寫在註冊的後面,同樣是在passport的views檔案裡

還是先貼上複製前面的檢視程式碼,然後再做對應引數的修改後就完成了

完成之後還是先寫文件註釋,函式實現的功能

然後就是分析並寫下對應的步驟,先簡單的分析下吧

首先按照規範需要接收兩個引數mobile和password,也就是賬號和密碼

然後校驗引數,先整體校驗引數是否齊全,然後在分開校驗,這裡需要先對不需要連線資料庫的資料

進行先行校驗,需要進行資料庫連線操作的放在後面。這樣比較省時間。

然後就是登入後實現狀態儲存,在我們寫註冊時就寫過對應的程式碼,這一步將程式碼複製過來就行

再然後就是更新使用者最後一次更新的時間,這個在我們寫註冊時就對資料表中的記錄欄位進行過修改記錄的是當前

時間,程式碼複製過來

最後就是返回結果,成功的結果,也就是大體的五步

下面我們來一步一步實現程式碼的編寫

第一步

# 1.接收引數(mobile,password)
    mobile = request.json.get("mobile")
    password = request.json.get("password") 

根據介面設計圖來接收對應的引數

第二步


# 2.校驗引數

# 2.1 判斷引數是否齊全 if not all([mobile,password]): return jsonify(errno= RET.PARAMERR ,errmsg="引數不齊") # 2.2 判斷手機號格式是否正確 mobile = mobile.strip() if not re.findall("^1[3|4|5|7|8][0-9]{9}$", mobile): return jsonify(errno=RET.PARAMERR, errmsg="手機號格式有誤") # 否返回json資料 # 2.3 通過手機號判斷使用者是否存在 try: user = User.query.filter_by(mobile=mobile).first() #返回的結果為布林值 except Exception as e : current_app.logger.error(e) return jsonify(errno=RET.DBERR,errmsg="手機號未找到") if not user : return jsonify(errno=RET.NODATA,errmsg=" 未找到該使用者") # 否返回json資料
 

首先對接收到所有引數進行整體校驗判斷是否齊全

然後是對手機號格式的校驗,正則,這個我們已經進行了多次了,程式碼複製過來就行。

然後通過手機號我們需要從我們的第三方資料庫中進行資料的查詢,所以需要進行異常捕捉並

處理,用使用者給的手機參看資料庫中是否存在資料。當我們使用first()查詢器 時,資料不存在時查詢結果不會報錯並返回布林值,這樣

就符合我們的判斷要求。

關於密碼(password)的校驗,因為我們存在資料庫裡的密碼是加密後的儲存的,所以不能直接拿出來和使用者輸入的密碼進行對比,必須藉助對應的

工具來進行

和加密密碼一樣,我們在User模型類的程式碼里加入一個函式,通過傳入使用者輸入的密碼來進行對比校驗,然後對函式返回的結果來進行判斷

這裡返回的結果為布林值。

需要用到我們的另外一個工具程式碼check_password_hash

對應函式的建立,這裡進行對比後產生的結果為布林值,符合我們的判斷要求

然後在進行使用者傳入的密碼的校驗,通過取反來對錯誤內容進行處理

 if not user.check_password(password):
        return jsonify(errno=RET.PARAMERR,errmsg="賬戶或密碼錯誤")

  

第三步

# 3.實現狀態保持
session["user_id"] = user.id
session["nick_name"] = user.nick_name
session["mobile"] = user.mobile

和註冊時一樣登入完成之後寫人session來進行狀態儲存  

 

第四步

# 4.記錄最後一次登入時間
    user.last_login = datetime.datetime.now #進行資料的更改,使用datetime模組
    try:
        db.session.commit()
    except Exception as e:
        current_app.logger.error(e)
        db.session.rollback()
        return jsonify(errno=RET.DBERR, errmsg="登入時間更新失敗") 

因為我們在進行查詢時就建立了對應使用者資料的連線,所以當我們修改資料時通過呼叫類屬性然後再從新賦值就可以進行

相關資料的修改,最後再提交就可以了,提交需要連線第三方資料庫所以需要建立異常捕捉,處理時因為我們是修改了資料庫資料

當失敗時需要使用回滾,新增到一半失敗是有可能的,所以當新增失敗時需要變回沒有更改之前。

第五步

#  5.返回結果
    return jsonify(errno=RET.OK,errmsg="登入成功")

返回成功的結果,當我們再次執行程式碼並登入成功時,參考資料庫資料最後一次登入

時間的更新是否正常就可以進行校驗功能是否實現