前端如何在headers存入token

第一步

先下载cookie插件

npm install js-cookie

然后在登录页面中导入cookie插件

import cookie from 'js-cookie'
//cookie有三个值 分别是 名字、值、作用域

第二步

实现登录方法返回token字符串（不贴代码了 写个登录方法从后端获取token）

然后把token放到cookie中

cookie.set('token',response.data.token,{domain:'localhost'})

第三步

创建拦截器（去src/api中看你导入的公用的js文件，我这里是request.js）

import request from '@/utils/request'

打开这个request.js文件把拦截器写在这里面

拦截器内容// http request拦截器
service.interceptors.request.use(
    config =>{
        //debugger
        //判断cookie是否有token  如果有的话 把值取出来放到headers中
        if(cookie.get('token')){
            config.headers['token'] = cookie.get('token');        
        }
        return config    
    },
    err =>{
        return Promise.reject(err);    
    }
)

第四步

调用接口 根据token获取用户信息；

因为cookie里只能存放字符需要先把你要放的东西转成串才可以存入

//第四步，调用接口，根据token获取用户信息，为了首页面展示
loginApi.getLoginUserInfo()
    .then(response =>{
        cookie.set('userIfo',JSON.stringify(response.data.userInfo,{domain:'localhost'}))    
    })

到此就完成了~