C#實現JWT無狀態驗證的實戰應用

時間 2021-03-04

標籤 html git github web ajax api 緩存服務器 mvc app 欄目 C# 简体版

原文原文鏈接

前言html

本文主要介紹JWT的實戰運用。git

準備工做github

首先咱們建立一個Asp.Net的，包含MVC和WebApi的Web項目。web

而後使用Nuget搜索JWT，安裝JWT類庫，以下圖。ajax

設計思路api

這裏咱們簡單的作了一個token驗證的設計，設計思路以下圖所示：緩存

代碼實現服務器

緩存

首先，咱們先開發工具類，根據設計思路圖可得知，咱們須要一個緩存類，用於在服務器端存儲token。mvc

編寫緩存相關類代碼以下：app

 public class CacheHelper
 {
     public static object GetCache(string key)
     {
         return HttpRuntime.Cache[key];
     }

     public static T GetCache<T>(string key) where T : class
     {
         return (T)HttpRuntime.Cache[key];
     }

     public static bool ContainsKey(string key)
     {
         return GetCache(key) != null;
     }

     public static void RemoveCache(string key)
     {
         HttpRuntime.Cache.Remove(key);
     }

     public static void SetKeyExpire(string key, TimeSpan expire)
     {
         object value = GetCache(key);
         SetCache(key, value, expire);
     }

     public static void SetCache(string key, object value)
     {
         _SetCache(key, value, null, null);
     }

     public static void SetCache(string key, object value, TimeSpan timeout)
     {
         _SetCache(key, value, timeout, ExpireType.Absolute);
     }

     public static void SetCache(string key, object value, TimeSpan timeout, ExpireType expireType)
     {
         _SetCache(key, value, timeout, expireType);
     }

     private static void _SetCache(string key, object value, TimeSpan? timeout, ExpireType? expireType)
     {
         if (timeout == null)
             HttpRuntime.Cache[key] = value;
         else
         {
             if (expireType == ExpireType.Absolute)
             {
                 DateTime endTime = DateTime.Now.AddTicks(timeout.Value.Ticks);
                 HttpRuntime.Cache.Insert(key, value, null, endTime, Cache.NoSlidingExpiration);
             }
             else
             {
                 HttpRuntime.Cache.Insert(key, value, null, Cache.NoAbsoluteExpiration, timeout.Value);
             }
         }
     }
 }
 /// <summary>
 /// 過時類型
 /// </summary>
 public enum ExpireType
 {
     /// <summary>
     /// 絕對過時
     /// 注：即自建立一段時間後就過時
     /// </summary>
     Absolute,

     /// <summary>
     /// 相對過時
     /// 注：即該鍵未被訪問後一段時間後過時，若此鍵一直被訪問則過時時間自動延長
     /// </summary>
     Relative,
 }

如上述代碼所示，咱們編寫了緩存幫助類—CacheHelper類。

CacheHelper類：使用HttpRuntime的緩存，類裏實現緩存的增刪改，由於使用的是HttpRuntime，因此，若是沒有設置緩存的超時時間，則緩存的超時時間等於HttpRuntime.Cache配置的默認超時時間。

若是網站掛載在IIS裏，那麼，HttpRuntime.Cache配置超時時間的地方在該網站的應用程序池中，以下圖：

Jwt的幫助類

如今咱們編寫Jwt的幫助類，代碼以下：

public class JwtHelper
{
    //私鑰  
    public const string secret = "MIGfMA0GCSqGSIb3DQEBAQUAA4GNAmD7RTE2drj6hf3oZjJpMPZUQ1Qjb5H3K3PNwIDAQAB";
    
    /// <summary>
    /// <summary>
    /// 生成JwtToken
    /// </summary>
    /// <param name="payload">不敏感的用戶數據</param>
    /// <returns></returns>
    public static string SetJwtEncode(string username,int expiresMinutes)
    {
        //格式以下
        var payload = new Dictionary<string, object>
        {
            { "username",username },
            { "exp ", expiresMinutes },
            { "domain", "" }
        };

        IJwtAlgorithm algorithm = new HMACSHA256Algorithm();
        IJsonSerializer serializer = new JsonNetSerializer();
        IBase64UrlEncoder urlEncoder = new JwtBase64UrlEncoder();
        IJwtEncoder encoder = new JwtEncoder(algorithm, serializer, urlEncoder);

        var token = encoder.Encode(payload, secret); 
        return token;
    }
   
    /// <summary>
    /// 根據jwtToken  獲取實體
    /// </summary>
    /// <param name="token">jwtToken</param>
    /// <returns></returns>
    public static IDictionary<string,object> GetJwtDecode(string token)
    {
        IJsonSerializer serializer = new JsonNetSerializer();
        IDateTimeProvider provider = new UtcDateTimeProvider();
        IJwtValidator validator = new JwtValidator(serializer, provider);
        IBase64UrlEncoder urlEncoder = new JwtBase64UrlEncoder();
        IJwtAlgorithm algorithm = new HMACSHA256Algorithm();
        IJwtDecoder decoder = new JwtDecoder(serializer, validator, urlEncoder, algorithm);
        var dicInfo = decoder.DecodeToObject(token, secret, verify: true);//token爲以前生成的字符串
        return dicInfo;
    }
}

代碼很簡單，實現了JWT的Code的建立和解析。

注：JWT的Code雖然是密文，但它是能夠被解析的，因此咱們不要在Code裏存儲重要信息，好比密碼。

JWT的Code與解析後的內容以下圖所示，左邊未Code，右邊未解析的內容。

AuthenticationHelper驗證幫助類

如今，咱們已經能夠編寫驗證類了，利用剛剛已建立的緩存幫助類和JWT幫助類。

AuthenticationHelper驗證幫助類代碼以下：

 public class AuthenticationHelper
 { 
     /// <summary>
     /// 默認30分鐘
     /// </summary>
     /// <param name="username"></param>
     public static void AddUserAuth(string username)
     {
         var token = JwtHelper.SetJwtEncode(username, 30);
         CacheHelper.SetCache(username, token, new TimeSpan(TimeSpan.TicksPerHour / 2)); 
     } 
     public static void AddUserAuth(string username, TimeSpan ts)
     { 
         var token = JwtHelper.SetJwtEncode(username, ts.Minutes);
         CacheHelper.SetCache(username, token, ts);

     }
     public static string GetToken(string username)
     {
         var cachetoken = CacheHelper.GetCache(username);
         return cachetoken.ParseToString();  
     } 
     public static bool CheckAuth(string token)
     {
         var dicInfo = JwtHelper.GetJwtDecode(token);
         var username = dicInfo["username"];

         var cachetoken = CacheHelper.GetCache(username.ToString());
         if (!cachetoken.IsNullOrEmpty() && cachetoken.ToString() == token)
         {
             return true;
         }
         else
         {
             return false;
         } 
     }
 }

如代碼所示，咱們實現了驗證token建立、驗證token獲取、驗證Token校驗三個方法。

到此，咱們的基礎代碼已經編寫完了，下面進入驗證的應用。

Fliter

首先，在Global.asax文件中，爲咱們WebApi添加一個過濾器，代碼以下：

 public class WebApiApplication : System.Web.HttpApplication
 {
     protected void Application_Start()
     {
         AreaRegistration.RegisterAllAreas();
         GlobalConfiguration.Configure(WebApiConfig.Register); 
         //webapiFilter
         System.Web.Http.GlobalConfiguration.Configuration.Filters.Add(new HttpPermissionFilter());
         System.Web.Http.GlobalConfiguration.Configuration.Filters.Add(new HttpExceptionFilter());
         //mvcFliter
         System.Web.Mvc.GlobalFilters.Filters.Add(new MvcExceptionFilter());
         System.Web.Mvc.GlobalFilters.Filters.Add(new MvcPermissionFilter()); 
         RouteConfig.RegisterRoutes(RouteTable.Routes);
         BundleConfig.RegisterBundles(BundleTable.Bundles);
     }
 }

代碼中建立了四個過濾器，分別是MVC的請求和異常過濾器和WebApi的請求和異常過濾器。

這裏咱們主要看WebApi的請求過濾器——HttpPermissionFilter。代碼以下：

public class HttpPermissionFilter : System.Web.Http.Filters.ActionFilterAttribute
{
    public override void OnActionExecuting(HttpActionContext actionContext)
    {
        string url ="請求Url" + actionContext.Request.RequestUri.ToString(); 
        var action = actionContext.ActionDescriptor.ActionName.ToLower();
        var controller = actionContext.ControllerContext.ControllerDescriptor.ControllerName.ToLower();
        if (controller != "login" && controller != "loginout")
        { 
            //客戶端段token獲取
            var token = actionContext.Request.Headers.Authorization != null ? actionContext.Request.Headers.Authorization.ToString() : "";
            //服務端獲取token 與客戶端token進行比較
            if (!token.IsNullOrEmpty() && AuthenticationHelper.CheckAuth(token))
            {
                //認證經過，可進行日誌等處理 
            }
            else
            { 
                throw new Exception("Token無效");
            } 
        }
    }
}

咱們的HttpPermissionFilter類繼承了System.Web.Http.Filters.ActionFilterAttribute，這樣他就能夠截獲全部的WebApi請求了。

而後咱們重寫了他的OnActionExecuting方法，在方法裏，咱們查詢到當前請求的Controller的名稱，而後對其進行了一個簡單的判斷，若是是login（登陸）或loginout（登出），那咱們就不對他的token進行驗證。若是是其餘請求，則會從請求的Headers的Authorization屬性裏讀取token，並使用AuthenticationHelper類對這個token進行正確性的驗證。

WebApi接口

如今咱們編寫WebApi接口，編寫一個登陸接口和一個普通請求接口。

登陸接口：這裏咱們使用AuthenticationHelper類建立一個token，並把他存儲到緩存中。

而後再把token返回給調用者。

普通接口：這裏咱們不作任何操做，就是簡單的返回成功，由於是否能夠訪問這個接口，已經又Filter控制了。

代碼以下:

public class LoginController : ApiController
{  
    public string Get(string username,string pwd)
    {
        AuthenticationHelper.AddUserAuth(username, new TimeSpan(TimeSpan.TicksPerMinute * 5));//5分鐘 
        string token = AuthenticationHelper.GetToken(username);
        return token;
    }  
}
public class RequestController : ApiController
{ 
    public string Get()
    {
        return "請求成功";
    }  
}

測試頁面

如今咱們編寫測試頁面，這裏咱們實現三個按鈕，登陸、帶token訪問Api、無token訪問Api。

代碼以下：

<div> 
    <script>
        $(document).ready(function () {
            $("#request").click(function () {
                var token = window.localStorage.getItem('token');
                if (token) {

                    $.ajax({
                        type: "GET",
                        url: "http://localhost:50525/api/Request",
                        success: function (data) {
                            $('#con').append('<div> success：' + data + '</div>');
                            console.log(data);
                        },
                        beforeSend: function (xhr) {
                            //向Header頭中添加Authirization
                            xhr.setRequestHeader("Authorization", token);
                        },
                        error: function (XMLHttpRequest, textStatus, errorThrown) { 
                            $('#con').append('<div> error：' + errorThrown + '</div>');
                        }
                    });
                }
                else {
                    alert("token不存在");
                }
            });
            $("#requestNotoken").click(function () {
                var token = window.localStorage.getItem('token');
                if (token) {

                    $.ajax({
                        type: "GET",
                        url: "http://localhost:50525/api/Request",
                        success: function (data) {
                            $('#con').append('<div> success：' + data + '</div>');
                            console.log(data);
                        },
                        error: function (XMLHttpRequest, textStatus, errorThrown) {
                            $('#con').append('<div> error：' + errorThrown + '</div>');
                        }
                    });
                }
                else {
                    alert("token不存在");
                }
            });
            $("#login").click(function () {
                $.ajax({
                    type: "GET",
                    url: "http://localhost:50525/api/Login/?username=kiba&pwd=518",
                    success: function (data) {
                      
                        $('#con').append('<div> token：' + data + '</div>');
                        console.log(data);
                        window.localStorage.setItem('token', data)  
                    }
                });
            });
        }); 
    </script> 
    <h1>測試JWT</h1> 
    <button id="login">登陸</button>
    <button id="request">帶token訪問Api</button>
    <button id="requestNotoken">無token訪問Api</button>
    <div id="con"></div>
</div>

測試結果以下：

如上圖所示，咱們已經成功實現簡單的token驗證。

----------------------------------------------------------------------------------------------------

到此JWT的實戰應用就已經介紹完了。

代碼已經傳到Github上了，歡迎你們下載。

Github地址： https://github.com/kiba518/JwtNet

----------------------------------------------------------------------------------------------------

注：此文章爲原創，任何形式的轉載都請聯繫做者得到受權並註明出處！
若您以爲這篇文章還不錯，請點擊下方的【推薦】，很是感謝！

https://www.cnblogs.com/kiba/p/14461836.html