在一些系統中，有時候用戶忘記密碼，可以通過向自己手機發送動態驗證碼的方式實作系統登錄功能，本篇隨筆介紹如何結合后端ABP框架的短信發送和快取模塊的處理，實作手機短信動態碼登陸處理，
一般的登錄方式，分為普通賬號登錄，動態密碼登陸，掃描二維碼登錄等幾種方式，其他方式這里不講，主要介紹動態碼登錄方式，
1、短信驗證碼的發送處理
我在上篇隨筆《ABP框架中短信發送處理，包括阿里云短信和普通短信商的短信發送集成》中介紹了如何使用ABP框架實作短信的發送處理，因此我們前后端通過短信的方式，可以實作動態密碼的登陸處理，
因此在授權登陸的控制器中，我們增加短信發送的介面注入使用，如下所示，
然后通過定義兩個介面，一個是發送動態驗證碼給用戶手機的介面，一個是根據用戶手機和動態驗證碼的方式進行登錄處理介面，
然后我們在這個驗證身份的控制器上增加兩個方法即可，
用例也就是分了兩個處理方法，
在處理發送短信驗證碼之前，我們來介紹一下短信驗證碼的處理規則，我們發送短信成功后，把驗證碼存在系統快取里面，一般系統快取是存放在Redis里面，快取需要一個鍵和定義好的類物件進行存盤，
我們定義好存盤的物件類，再在系統中使用即可，
/// <summary> /// 短信登陸動態密碼快取物件 /// </summary> [Serializable] public class SmsLoginCodeCacheItem { public const string CacheName = "AppSmsLoginCodeCacheItem"; public string Code { get; set; } public string PhoneNumber { get; set; } public SmsLoginCodeCacheItem() { } public SmsLoginCodeCacheItem(string code, string phone) { Code = code; PhoneNumber = phone; } }
我們可以在系統模塊初始化的時候，配置好快取對應的失效時間，如下所示，
//配置SMS登錄動態碼有效期限 Configuration.Caching.Configure(SmsLoginCodeCacheItem.CacheName, cache => { cache.DefaultSlidingExpireTime = TimeSpan.FromMinutes(Constants.SmsCodeExpiredMinutes); });
發送短信驗證碼作為動態密碼的邏輯代碼如下所示，
/// <summary> /// 發送登錄動態碼 /// </summary> /// <param name="model">手機登錄動態碼</param> /// <returns></returns> [HttpPost] public async Task<CommonResult> SendPhoneLoginSmsCode([FromBody] AuthenticateByPhoneCaptchaModel model) { //獲取隨機6位數字動態驗證碼 var code = RandomHelper.GetRandom(100000, 999999).ToString(); //使用自定義模板處理短信發送 string message = string.Format(Constants.MySmsCodeTemplate, code); var result = await _smsSender.SendAsync(model.PhoneNumber, message); if(result.Success) { var cacheKey = model.PhoneNumber;//以手機號碼作為鍵存盤驗證碼快取 var cacheItem = new SmsLoginCodeCacheItem { Code = code, PhoneNumber = model.PhoneNumber }; var cache = _cacheManager.GetCache<string, SmsLoginCodeCacheItem>(SmsLoginCodeCacheItem.CacheName); cache.Set(cacheKey, cacheItem); } return result; }
我們還需要在前端中設計一個使用動態短信碼登錄的界面，如下所示，
短信發送成功，可以在用戶手機查看對應的動態碼，
驗證碼發送后，我們也可以在Redis中看到對應的資料，如下所示，
2、動態碼登錄處理
發送了短信碼后，系統在快取中存放一段時間的資料，如果在這個期間進行登錄，會根據快取進行匹配，如果匹配成功，那么就進行相關登錄身份的處理即可，
系統登錄驗證的處理代碼如下所示，
/// <summary> /// 通過手機驗證碼授權 /// </summary> /// <param name="model">手機驗證碼Dto</param> /// <returns></returns> [HttpPost] public async Task<AuthenticateResultModel> AuthenticateByPhoneCaptcha([FromBody] AuthenticateByPhoneCaptchaModel model) { var loginResult = await GetLoginResultByPhoneCaptchaAsync( model.PhoneNumber, model.SmsCode, GetTenancyNameOrNull() ); //if(loginResult.Result == AbpLoginResultType.Success) //這里成功，移除短信快取 var cache = _cacheManager.GetCache<string, SmsLoginCodeCacheItem>(SmsLoginCodeCacheItem.CacheName); cache.Remove(model.PhoneNumber);//移除快取短信鍵值 var accessToken = CreateAccessToken(CreateJwtClaims(loginResult.Identity)); return new AuthenticateResultModel { AccessToken = accessToken, ExpireInSeconds = (int)_configuration.Expiration.TotalSeconds, EncryptedAccessToken = GetEncryptedAccessToken(accessToken), UserId = loginResult.User.Id }; }
這里主要的邏輯封裝在 GetLoginResultByPhoneCaptchaAsync 中，這個登錄的方式可以參考ABP框架基礎的登陸方式進行改動即可，
/// <summary> /// 獲取登陸結果通過手機驗證碼 /// </summary> /// <param name="phoneNumber">手機號</param> /// <param name="captcha">驗證碼</param> /// <param name="tenancyName">租戶名</param> /// <returns></returns> private async Task<AbpLoginResult<Tenant, User>> GetLoginResultByPhoneCaptchaAsync(string phoneNumber, string captcha, string tenancyName) { var loginResult = await _logInManager.LoginByMobileAsync(phoneNumber, captcha, tenancyName); switch (loginResult.Result) { case AbpLoginResultType.Success: return loginResult; default: throw _abpLoginResultTypeHelper.CreateExceptionForFailedLoginAttempt(loginResult.Result, loginResult.User.UserName, tenancyName); } }
參照ABP框架基礎的登陸授權方式，我們在UserManager中增加類似的驗證碼登陸管理方式，如下所示，
前端在處理相關發送驗證碼和登錄授權的操作，是針對API的呼叫，因此需要封裝對應的API處理，
然后仿照常規登錄的處理，撰寫一個動態碼登錄的處理方式，放在對應的Module中即可，
dynamiclogin({ commit }, userInfo) { // 動態密碼登陸
const { mobile, smscode } = userInfo
return new Promise((resolve, reject) => {
tokenauth.AuthenticateByPhoneCaptcha({ phoneNumber: mobile.trim(), smsCode: smscode }).then(response => {
const { result } = response // 獲取回傳物件的 result
// console.log(result)// 記錄資料
var token = result.accessToken // 用戶令牌
var userId = result.userId // 用戶id
// 修改State物件，記錄令牌和用戶Id
commit('SET_TOKEN', token)
commit('SET_USERID', userId)
// 存盤cookie
setToken(token)
setUserId(userId)
resolve()
}).catch(error => {
reject(error)
})
})
},
在登錄界面中，輸入動態碼登錄即可順利進入系統，和常規的處理一樣，
以上就是參照常規賬號密碼登錄的方式，構建一個動態碼登錄的處理，流程還是差不多，不過整合了短信發送，快取處理，賬號登陸等幾個流程，可以作為一個簡單的系統登錄程序的了解，
轉載請註明出處，本文鏈接：https://www.uj5u.com/net/245481.html
標籤：.NET Core