軟體技術-零基礎-MD5加密處理和自動跳轉
歡迎關注我的專欄( つ•̀ω•́)つ【人工智慧通識】
如何將使用者的密碼加密之後再儲存？
MD5
加密的目的是保護使用者的隱私，尤其是一些很敏感的密碼，原則上這些密碼的明文只能出現在使用者電腦上，不能在網路上傳輸，更不能儲存在網站伺服器上。
MD5是一種不可逆的加密演算法，就是說它可以把使用者密碼變為一串新字元，而原則上沒有任何方法可以把這串新字元再變回去找到使用者真實的密碼。（但沒有什麼是絕對的，只是相對來說是這樣）
MD5總是生成32個英文字元和字母混合的字串。
前端加密
實際上我們只需要在網頁端將使用者所有輸入的密碼都處理一下就可以了，不涉及後端伺服器程式，因為使用者密碼到底是什麼格式，對於伺服器來說都是一樣的儲存、驗證。
需要為前端相關頁面 register.html，login.html，resetPw.html 都新增一個加密工具：
<script src="https://cdn.bootcss.com/spark-md5/3.0.0/spark-md5.min.js"></script>
然後把所有向介面傳送的Pw資料都用 SparkMD5.hash 程式碼包裹一下：
Pw: SparkMD5.hash($('#pw').val())
然後Golang服務端對Pw驗證的正則表示式改為 ^[0-9a-z]{32}$ ，應該涉及到 login.go,register.go,resetPw.go 等多個檔案。
然後把服務端資料庫都刪除，然後重新測試登入和註冊、改密碼和自動登入功能。
註冊和重置後自動登入
先做一個統一的建立新Token並寫入Cookie的方法 ext/NewToken.go ，其程式碼如下：
package ext
import (
"app/tool"
"app/util"
"context"
"encoding/json"
"net/http"
"time"
uuid "github.com/satori/go.uuid"
"go.mongodb.org/mongo-driver/bson"
)
//NewToken 建立新token，返回一個基本的使用者資訊Token和Uid，用於使用者手工登入註冊和重置時候使用
func NewToken(w http.ResponseWriter, uids string) string {
//建立token
token, _ := uuid.NewV4()
tokens := token.String()
//刪除舊的,建立新的
coll := tool.MongoDBCLient.Database("myweb").Collection("token")
du := bson.M{"Token": tokens, "Id": uids, "Ts": time.Now().Unix()}
du2 := bson.M{"Id": uids}
coll.DeleteMany(context.TODO(), du2)
coll.InsertOne(context.TODO(), du)
//返回物件
data := map[string]string{
"Token": tokens,
"Uid":uids}
datas, err := json.Marshal(data)
if err != nil {
return ""
}
//返回id，寫入Token和Uid
util.SetCookie(w, "Uid", uids)
util.SetCookie(w, "Token", tokens)
return string(datas)
}
這個主要是為了將登入、註冊和重置密碼後所要做的同樣工作統一在一起了。
然後我們就可以修改 login.go 簡化很多：
if u["Pw"] == ds.Pw {
uids := u["_id"].(primitive.ObjectID).Hex()
datas := ext.NewToken(w, uids)
util.WWrite(w, 0, "登入成功", datas)
} else {
util.WWrite(w, 1, "郵箱與使用者名稱不匹配", nil)
}
return
同樣簡化 register.go :
uids := res.InsertedID.(primitive.ObjectID).Hex() datas := ext.NewToken(w, uids) util.WWrite(w, 0, "註冊成功。", datas) return
修改 resetPw.go ：
//建立token，返回修改的賬號
var nu bson.M
dbc.FindOne(context.TODO(), bson.M{"Email": ds.Email}).Decode(ν)
uids := nu["_id"]
datas := ext.NewToken(w, uids.(string))
util.WWrite(w, 0, "修改成功", datas)
return
這樣我們再登入、註冊和重置之後都會更新Token，如果需要獲取使用者郵箱等資訊，可以再執行 autoLogin 介面就可以了。
自動跳轉
比如說使用者開啟首頁，然後會執行 autoLogin ，沒通過，被我們跳轉到登入頁，然後使用者登入成功，——這時候應該跳轉回首頁啊，怎麼跳？
我們之前使用過 location = '/page/login.html' 實現跳轉。
但是，當我們處於登入頁的時候，登陸成功我們要跳回去，但我們怎麼知道使用者從哪裡過來的呢？
所以在跳過來的時候就必須做好標記傳遞原來的頁面地址過來。
首先在 index.html 中修改跳轉連結：
location = '/page/login.html?ref='+location.pathname
這裡的 location.pathname 就是頁面地址。
然後在 login.html 頁面中增加用來提取連結的工具
<script src="https://cdn.bootcss.com/jquery-url-parser/2.3.1/purl.min.js"></script>
登入成功後修改：
$.post('/api/Login', JSON.stringify(data), function (res) {
if (res['Code'] == 0) {
//登入成功
location = purl(location.href).param('ref') || "/"
} else {
alert(res['Msg'])
}
}, 'json')
這裡 purl(location.href).param('ref') 表示提取剛才傳過來的地址。雙豎線表示如果沒有傳來地址那麼就回 / 首頁。
同時我們修改一下注冊按鈕連結，改為使用 script 跳轉：
<a onClick='goReg()' style="color:#CCC;cursor: pointer;"> <h4>註冊</h4> </a>
底部新增配套的程式碼：
//註冊連結動態跳轉
function goReg(){
ref=purl(location.href).param('ref')
fix=ref?('?ref='+ref):''
location = '/page/register.html'+fix
}
可以使用同樣的方法新增 忘記密碼 頁面的連結跳轉到 forgotPw.html 頁面。也可以為 register.html 和 forgotPw.html 修改類似的成功跳轉回去的功能。
小結
前後從開始部署Golang到編寫前端頁面，然後前後端一起實現登入註冊功能，這裡總計用了15篇文章，基本上告一段落，後續還有很多內容，大家可以從Golang官方
歡迎關注我的專欄( つ•̀ω•́)つ【人工智慧通識】
每個人的智慧新時代
如果您發現文章錯誤，請不吝留言指正；
如果您覺得有用，請點喜歡；
如果您覺得很有用，歡迎轉載~
END