Vue-login 案例的学习(一)

来源：互联网发布：个性淘宝店名大全编辑：程序博客网时间：2024/05/29 15:36

Token认证机制的原理
如今对于网站的登录后都要做个验证，保护网站的安全；Token 是包含用户名、有效期和某些专有信息并通过共享密钥加密的信息字符串。
1.1. Token的生成和存储问题
Token的生成一般采用uuid保证唯一性，当用户登录时为其生成一个唯一的Token，存储一般在数据库当中。
1.2. Token过期时间的问题
采用把Token二次保存在cookie和session中，根据cookie和session的过期时间来维护Token。
1.3. 怎么保证用户使用状态下token持续时间的一直有效
从cookie取出Token，获取用户信息；如果用户有操作权限，那么就会用当前的时间来更新cookies的过期时间，从而维护Token的使用时间

基于Token的身份验证方法
使用基于 Token 的身份验证方法，在服务端不需要存储用户的登录记录。大概的流程是这样的：
1. 客户端使用用户名跟密码请求登录
2. 服务端收到请求，去验证用户名与密码
3. 验证成功后，服务端会签发一个 Token，再把这个 Token 发送给客户端
4. 客户端收到 Token 以后可以把它存储起来，比如放在 Cookie 里或者 Local Storage 里
5. 客户端每次向服务端请求资源的时候需要带着服务端签发的 Token
6. 服务端收到请求，然后去验证客户端请求里面带着的 Token，如果验证成功，就向客户端返回请求的数据
实现Token验证的标准办法: JWT
JWT表示：JSON Web Tokens

JWT的结构：

header部分

payload部分

signature部分

JWT格式：
中间用. 分隔开，并且使用Base64编码。类似：
```
xxxxx.yyyyy.zzzzz；
```
header部分：
header部分通常包含两个部分：Token类型和采用的加密算法(JWT类型和HS256算法)
```
{ "typ": "JWT", "alg": "HS256"}  
```
使用Base64编码，header部分就变成了：
```
eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9
```
payload部分：
payload部分是Token的主要内容，包含了claim,claim有三种类型：reserved（这些claim字段是JWT自带的，可选择使用） , public（根据需要定义自己的字段）和 private（这些是自定义的字段，可以用来在双方之间交换信息） .
例子：
```
  ```json
```
{
“sub”:”js”,//JWT定义的claim字段，意思：主题
“name”:”lizi”,//自定义的claim字段
“exp”:”1438955445”,//JWT定义的claim字段，意思：过期时间
“age”:11//自定义的claim字段
}
“`

signature部分：
完成最后一个部分需要使用Base64编码后的header和payload部分以及一个密钥，生成Token步骤：
先使用Base64编码header和payload。
在使用加密算法（HS256算法）加密，在加密时，加入一个密钥。
最后生成了signature部分。
```
var encodedString = base64UrlEncode(header) + "." + base64UrlEncode(payload); HMACSHA256(encodedString, 'secret');
```
最后生成的Token类似如下：
```
eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJuaW5naGFvLm5ldCIsImV4cCI6IjE0Mzg5NTU0NDUiLCJuYW1lIjoid2FuZ2hhbyIsImFkbWluIjp0cnVlfQ.SwyHTEx_RQppr97g4J5lKXtabJecpejuef8AqKYMAJc
```

0 0