本博文主要讲述三方面内容：跨域身份验证、JWT相关理论、JWT项目实战

一、跨域身份验证

JSON Web Token（JWT）是目前最流行的跨域身份验证解决方案。今天给大家介绍JWT的原理和用法。

跨域身份验证

Internet服务无法与用户身份验证分开。一般过程如下。
1.用户向服务器发送用户名和密码。
2.验证服务器后，相关数据（如用户角色，登录时间等）将保存在当前会话中。
3.服务器向用户返回session_id，session信息都会写入到用户的Cookie。
4.用户的每个后续请求都将通过在Cookie中取出session_id传给服务器。
5.服务器收到session_id并对比之前保存的数据，确认用户的身份。

跨域身份验证及JWT项目练习

这种模式最大的问题是，没有分布式架构，无法支持横向扩展。如果使用一个服务器，该模式完全没有问题。但是，如果它是服务器群集或面向服务的跨域体系结构的话，则需要一个统一的session数据库库来保存会话数据实现共享，这样负载均衡下的每个服务器才可以正确的验证用户身份。

例如虫虫举一个实际中常见的单点登陆的需求：站点A和站点B提供同一公司的相关服务。现在要求用户只需要登录其中一个网站，然后它就会自动登录到另一个网站。怎么做？

一种解决方案是听过持久化session数据，写入数据库或文件持久层等。收到请求后，验证服务从持久层请求数据。该解决方案的优点在于架构清晰，而缺点是架构修改比较费劲，整个服务的验证逻辑层都需要重写，工作量相对较大。而且由于依赖于持久层的数据库或者问题系统，会有单点风险，如果持久层失败，整个认证体系都会挂掉。

跨域身份验证及JWT项目练习

本文介绍另外一种灵活的解决方案，通过客户端保存数据，而服务器根本不保存会话数据，每个请求都被发送回服务器。 JWT是这种解决方案的代表。

二、JWT原理

1、JWT的原则

JWT的原则是在服务器身份验证之后，将生成一个JSON对象并将其发送回用户，如下所示。
{
"UserName": "Chongchong",
"Role": "Admin",
"Expire": "2018-08-08 20:15:56"
}
之后，当用户与服务器通信时，客户在请求中发回JSON对象。服务器仅依赖于这个JSON对象来标识用户。为了防止用户篡改数据，服务器将在生成对象时添加签名（有关详细信息，请参阅下文）。
服务器不保存任何会话数据，即服务器变为无状态，使其更容易扩展。

2、JWT的数据结构

典型的，一个JWT看起来如下图。
改对象为一个很长的字符串，字符之间通过"."分隔符分为三个子串。注意JWT对象为一个长字串，各字串之间也没有换行符，此处为了演示需要，我们特意分行并用不同颜色表示了。每一个子串表示了一个功能块，总共有以下三个部分：
JWT的三个部分如下。JWT头、有效载荷和签名，将它们写成一行如下。

跨域身份验证及JWT项目练习

我们将在下面介绍这三个部分。

2.1 JWT头

JWT头部分是一个描述JWT元数据的JSON对象，通常如下所示。
{
"alg": "HS256",
"typ": "JWT"
}
在上面的代码中，alg属性表示签名使用的算法，默认为HMAC SHA256（写为HS256）；typ属性表示令牌的类型，JWT令牌统一写为JWT。
最后，使用Base64 URL算法将上述JSON对象转换为字符串保存。

2.2 有效载荷

有效载荷部分，是JWT的主体内容部分，也是一个JSON对象，包含需要传递的数据。 JWT指定七个默认字段供选择。
iss：发行人
exp：到期时间
sub：主题
aud：用户
nbf：在此之前不可用
iat：发布时间
jti：JWT ID用于标识该JWT
除以上默认字段外，我们还可以自定义私有字段，如下例：
{
"sub": "1234567890",
"name": "chongchong",
"admin": true
}
请注意，默认情况下JWT是未加密的，任何人都可以解读其内容，因此不要构建隐私信息字段，存放保密信息，以防止信息泄露。
JSON对象也使用Base64 URL算法转换为字符串保存。

2.3签名哈希

签名哈希部分是对上面两部分数据签名，通过指定的算法生成哈希，以确保数据不会被篡改。
首先，需要指定一个密码（secret）。该密码仅仅为保存在服务器中，并且不能向用户公开。然后，使用标头中指定的签名算法（默认情况下为HMAC SHA256）根据以下公式生成签名。
HMACSHA256(base64UrlEncode(header) + "." + base64UrlEncode(payload),
secret)
在计算出签名哈希后，JWT头，有效载荷和签名哈希的三个部分组合成一个字符串，每个部分用"."分隔，就构成整个JWT对象。

2.4 Base64URL算法

如前所述，JWT头和有效载荷序列化的算法都用到了Base64URL。该算法和常见Base64算法类似，稍有差别。
作为令牌的JWT可以放在URL中（例如api.example/?token=xxx）。 Base64中用的三个字符是"+"，"/"和"="，由于在URL中有特殊含义，因此Base64URL中对他们做了替换："="去掉，"+"用"-"替换，"/"用"_"替换，这就是Base64URL算法，很简单把。

3. JWT的用法

客户端接收服务器返回的JWT，将其存储在Cookie或localStorage中。
此后，客户端将在与服务器交互中都会带JWT。如果将它存储在Cookie中，就可以自动发送，但是不会跨域，因此一般是将它放入HTTP请求的Header Authorization字段中。
Authorization: Bearer
当跨域时，也可以将JWT被放置于POST请求的数据主体中。

4. JWT问题和趋势

1、JWT默认不加密，但可以加密。生成原始令牌后，可以使用改令牌再次对其进行加密。
2、当JWT未加密方法是，一些私密数据无法通过JWT传输。
3、JWT不仅可用于认证，还可用于信息交换。善用JWT有助于减少服务器请求数据库的次数。
4、JWT的最大缺点是服务器不保存会话状态，所以在使用期间不可能取消令牌或更改令牌的权限。也就是说，一旦JWT签发，在有效期内将会一直有效。
5、JWT本身包含认证信息，因此一旦信息泄露，任何人都可以获得令牌的所有权限。为了减少盗用，JWT的有效期不宜设置太长。对于某些重要操作，用户在使用时应该每次都进行进行身份验证。
6、为了减少盗用和窃取，JWT不建议使用HTTP协议来传输代码，而是使用加密的HTTPS协议进行传输。

三、JWT项目练习

创建解决方案

创建解决方案JwtWebApi，添加JwtWebApi网站，并添加Jwt引用到项目

跨域身份验证及JWT项目练习

添加数据模型

添加用户数据模型，类文件LoginRequest.cs，代码：

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace JwtWebApi.Models
{
    public class LoginRequest
    {
        public string UserName { get; set; }

        public string Password { get; set; }
    }
}

添加认证信息数据模型，类文件AuthInfo.cs，代码：

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace JwtWebApi.Models
{
    public class AuthInfo
    {
        //模拟JWT的payload
        public string UserName { get; set; }

        public List<string> Roles { get; set; }

        public bool IsAdmin { get; set; }
    }
}

添加登录返回信息数据模型，类文件LoginResult.cs，代码：

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace JwtWebApi.Models
{
    public class LoginResult
    {
        public bool Success { get; set; }

        public string Token { get; set; }

        public string Message { get; set; }
    }
}

添加控制器

添加HomeController，从ApiControl 继承，代码：

using JWT;
using JWT.Algorithms;
using JWT.Serializers;
using JwtWebApi.Models;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Http;
using System.Web.Mvc;

namespace JwtWebApi.Controllers
{
    public class HomeController : ApiController
    {
        public LoginResult Post([FromBody]LoginRequest request)
        {
            LoginResult rs = new LoginResult();
            //这是是获取用户名和密码的，这里只是为了模拟
            if (request.UserName == "JohnLee" && request.Password == "123456")
            {
                AuthInfo info = new AuthInfo { UserName = "JohnLee", Roles = new List<string> { "Admin", "Manage" }, IsAdmin = true };
                try
                {
                    const string secret = "two heads are better than one";
                    //secret需要加密
                    IJwtAlgorithm algorithm = new HMACSHA256Algorithm();
                    IJsonSerializer serializer = new JsonNetSerializer();
                    IBase64UrlEncoder urlEncoder = new JwtBase64UrlEncoder();
                    IJwtEncoder encoder = new JwtEncoder(algorithm, serializer, urlEncoder);
                    var token = encoder.Encode(info, secret);
                    rs.Message = "Post method, LoginRequest and AuthInfo and LoginResult object used, token returned.";
                    rs.Token = token;
                    rs.Success = true;
                }
                catch (Exception ex)
                {
                    rs.Message = ex.Message;
                    rs.Success = false;
                }
            }
            else
            {
                rs.Message = "fail";
                rs.Success = false;
            }
            return rs;
        }
    }
}

创建UserController，继承ApiController，代码：

using JwtWebApi.Attributes;
using JwtWebApi.Models;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Net.Http;
using System.Web.Http;

namespace JwtWebApi.Controllers
{
    public class UserController : ApiController
    {
        [ApiAuthorize]
        public string Get()
        {
            AuthInfo info = RequestContext.RouteData.Values["auth"] as AuthInfo;
            if (info == null)
            {
                return "获取不到，失败";
            }
            else
            {
                return $"获取到了，Auth的Name是 {info.UserName},角色是{info.Roles[0]}:{info.Roles[1]}";
            }
        }
    }
}

添加页面

添加登录页面Index.html，代码：

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <meta charset="utf-8" />
    <script src="../Scripts/jquery-1.10.2.min.js"></script>
</head>
<body>

    <!--界面定义 START-->
    <fieldset>
        <legend>身份验证</legend>
        <form>
            <label for="UserName">用户名:</label><input type="text" name="userName" id="userName" value="wangshibang" />
            <br />
            <br />
            <label for="Password">密码:</label><input type="password" name="password" id="password" value="123456" />
            <br />
            <br />
        </form>
        <button id="login">登录</button>
    </fieldset>
    <br />

    <fieldset>
        <legend>调用接口</legend>
        <button id="invoke">调用接口</button>
    </fieldset>
    <!--界面定义 END-->

    <script>
        $(function () {
            //调用api站点的登录接口,接口在登录成功后返回一个token。
            $("#login").on("click", function () {
                $.ajax({
                    url: "http://localhost:49484/api/home",
                    data: $("form").serialize(),
                    method: "post",
                    success: function (data) {
                        if (data.Success) {
                            //为简单起见，将token保存在全局变量中。
                            window.token = data.Token;
                            alert("登录成功" + "\r\n" + data.Message +"\r\n"+ data.Token);
                        } else {
                            alert("登录失败:" + data.Message);
                        }
                    }
                });
            });

            //调用api站点的获取数据的接口，该接口要求身份验证。
            $("#invoke").on("click", function () {
                console.log(window.token);
                $.ajax({
                    url: "http://localhost:49484/api/user",
                    method: "get",
                    headers: { "auth": window.token },//通过请求头来发送token，放弃了通过cookie的发送方式
                    complete: function (jqXHR,textStatus) {
                        alert(jqXHR.responseText);
                    },

                });
            });
        });
    </script>
</body>
</html>

以上是有关webapi 接口访问签名认证的JWT方式介绍，这样我们在做接口项目时，可以根据需要将不同方法授权给相应用户。

跨域身份验证及JWT项目练习

一、跨域身份验证

跨域身份验证

二、JWT原理

1、JWT的原则

2、JWT的数据结构

2.1 JWT头

2.2 有效载荷

2.3签名哈希

2.4 Base64URL算法

3. JWT的用法

4. JWT问题和趋势

三、JWT项目练习

创建解决方案

添加数据模型

添加控制器

添加页面

相关推荐