vue中携带token以及发送ajax

在项目中基本登录都会存在token,而我们也就需要在每次发送ajax的时候就必须携带他。从而最有效的办法,就是在设置请求头携带token,这样设置一次后面的每一次都会携带着这个token。

一:设置请求头

axios.interceptors.request.use(config => {
    let token = local.get('t_k') 

    if (token) {
        config.headers.Authorization = token;
    }

    return config
})

  这里的local.get是我封装的本地存储的方法。然后if进行判断是否存在这个token。这里面的Authorization不是固定的,具体看后端命名。比如我这后端命名为mtoken也就相当于Authorization替换成mtoken !!!.替换后可以在浏览器中进行检查

一:

 二:

 三:

四:

 当你书写正确的时候第四步的里面就会有一个属性是你设置的属性,属性值等于后端给你的token

现在我们把token携带好后就开始发ajax

我这的需求相当于,进入页面也要求得到数据,也就是在vue的生命周期的调用你的ajax函数,

async submitForm() {
      let res = await zjshouyi(this.loginForm);
      console.log(res);
    },

  这里面的async和await是用来处理异步的。然后zjshouyi是我封装的ajax请求函数

  created() {
    this.submitForm();
  },

  然后我是放在vue的创建后进行发送ajax,一点要注意一下!!!  这里的函数前面一定要带一个this不然会报错,报你的函数未定义

原文地址:https://www.cnblogs.com/Old-vegetable-chicken/p/14171468.html