建設網(wǎng)站的方案抖音競價推廣怎么做
??重新創(chuàng)建WebApi項目,安裝Microsoft.AspNetCore.Authentication.JwtBearer包,將之前JwtBearer測試項目中的初始化函數(shù),jwt配置類、token生成類全部挪到項目中。
??重新編寫login函數(shù),之前測試Cookie和Session認證時用的函數(shù)適合mvc模式,WebApi項目下函數(shù)返回的是狀態(tài)碼及其它信息,直接將開源博客Blog項目中的ApiResult類照搬過來,如果登錄成功則將token保存到Msg屬性中返回客戶端。login函數(shù)的主要代碼如下(用戶名及密碼驗證還是寫死的,后續(xù)再調整成從數(shù)據(jù)庫中查詢):
public async Task<ApiResult> Login([FromBody]UserInfo info)
{if (info.Name == "gc_2299" && info.Password == "XXXXXX"){ApiResult result = new ApiResult();result.UserName = info.Name;result.Msg=GetToken(info.Name);return result;}else{return new ApiResult("身份驗證失敗", 500, false);}
}private string GetToken(string name)
{List<Claim> claims = new List<Claim>();claims.Add(new Claim(ClaimTypes.Name, name)); DateTime expres = DateTime.Now.AddSeconds(_jwtconfig.Value.Expres);byte[] secbyse = Encoding.UTF8.GetBytes(_jwtconfig.Value.Key);var secKey = new SymmetricSecurityKey(secbyse);var credetials = new SigningCredentials(secKey, SecurityAlgorithms.HmacSha256);var tokenDescriptor = new JwtSecurityToken(claims: claims, expires: expres, signingCredentials: credetials, issuer:_jwtconfig.Value.Issuer, audience: _jwtconfig.Value.Audience);return new JwtSecurityTokenHandler().WriteToken(tokenDescriptor);
}
??前端登錄頁面也是直接復制的開源博客Blog項目中的后臺登錄頁面,簡化了不少東西。不過沒法直接用它的js代碼(使用jQuery的post方法調不到后臺的login函數(shù),暫時不清楚怎么回事兒,網(wǎng)上很多示例都是用的ajax,所以改成了ajax),將登錄函數(shù)的js代碼修改如下:
layui.use(['layer', 'form'], function () {var layer = layui.layer;var form = layui.form,$ = layui.jquery;form.on("submit(login)",function (data) {login();});function login() {var $btn = $("#btnLogin");$btn.text("登錄中...").attr("disabled", "disabled").addClass("layui-disabled");var parm = {};$("form input").each(function () {parm[$(this).attr("name")] = $(this).val();}); $.ajax({type: 'POST',url: 'https://localhost:7051/Login/Login',contentType: 'application/json',data: JSON.stringify(parm),success: function (result) {if (result.statusCode == 200) {layer.msg("登錄成功,歡迎" + result.userName +",你的token=" + result.msg);sessionStorage.setItem("user", result.userName)sessionStorage.setItem("token", result.msg);}else{layer.msg("登錄失敗,錯誤消息為:" + result.msg);}$btn.text('登錄').removeClass("layui-disabled").removeAttr("disabled");},error: function () {layer.msg("登錄失敗");$btn.text('登錄').removeClass("layui-disabled").removeAttr("disabled");}});}
});
??最后是登錄效果,截圖如下:
??從瀏覽器的會話存儲空間中可以看到登錄成功后保存的用戶名及token,便于其它頁面使用。
參考文獻:
[1]https://www.jianshu.com/p/a2804e72d296
[2]https://blog.csdn.net/sD7O95O/article/details/85043160
[3]https://www.cnblogs.com/qiongkangle/p/13347283.html
[4]https://www.cnblogs.com/xbhp/p/17401507.html
[5]https://www.cnblogs.com/superstar/p/16491428.html
[6]https://blog.csdn.net/weixin_44877917/article/details/140609294
[7]https://blog.csdn.net/qq_40287041/article/details/143368882