一、token

token就是一块令牌，减少频繁的查询数据库，减轻服务器的压力，第一次登陆之后，服务生成一个token返回给客户端，客户端之后只需带着这个token请求数据即可，无需再次带上用户名和密码

二、react使用localStorage存储token

1.流程

1）首次登录时，后端服务器判断用户账号密码正确之后，根据用户id、用户名、定义好的秘钥、过期时间生成 token ，返回给前端；

2）前端拿到后端返回的 token ,存储在 localStorage 和 Redux里；

3)前端每次路由跳转，判断 localStorage 有无 token ，没有则跳转到登录页，有则请求获取用户信息，改变登录状态；

4)每次请求接口，在 Axios 请求头里携带 token;

后端接口判断请求头有无 token，没有或者 token 过期，返回401；

5)前端得到 401 状态码，重定向到登录页面。

2.具体应用

1）.将token存在本地(用cookie或者localstorage )

localStorage.setItem('rl',JSON.stringify({
       user:res.data.user,
       token,res.data.token
     }))

2）.在主文件中,判断本地登录状态，如果localStorage存进去了，就把需要的数据存在全局保存

 if(localStorage.getItem('rl')){
        // 写入redux,根据keys来匹配的
         store.dispatch({
          type:'setUser',
           user:JSON.parse(localStorage.getItem('rl'))
          })
       }

3）.清空本地，比如退出登陆的时候

localStorage.removeItem('rl')

4）.每次发送请求的时候将token放到响应头里

//首先判断有没有数据，或者token
if (JSON.parse(localStorage.getItem('rl'))) {
	//将token放到响应头中
	let token = JSON.parse(localStorage.getItem('rl')).token
	config.headers.Authorization = token; //将token放到请求头发给服务器
	//axios.defaults.headers.common['Authorization'] = token;
	console.log(config)
	} else {
		console.log('localStorage里面没有东西')
	}