前言

  有这样的一个需求,后台服务器要求把token放在请求头里面

  嗯一般是通过data里面通过参数带过去的

第一种方法

  全局改变:

  Vue.http.headers.common['token'] = store.state.token;
  之前是吧token刚在data里面的
  是我封装的一个get 请求,亲测有用。现在我们项目就是用的这一种

  然后放一个请求成功的实例

  首先会先发一个 OPTIONS 预请求

  

  然后发出正式请求

  

第二种方法:

  不能局限于一种方法嘛!

  第二种方法是:在Vue实例中设置

var vm = new Vue({
el:'#app',
data:{
showList: true,
title: null
},
http: {
root: '/',
headers: {
token: token
}
}
})

第三种方法:在拦截器中设置  vue interceptors 设置请求头

Vue.http.interceptors.push((request, next) => {
request.headers.set('token', token); //setting request.headers
next((response) => {
return response
})
})

还可以这样

  在在main.js添加过滤器

Vue.http.interceptors.push((request,next)=>{
//request.credentials = true; // 接口每次请求会跨域携带cookie
//request.method= 'POST'; // 请求方式(get,post)
//request.headers.set('token','111') // 请求headers携带参数 next(function(response){
return response; });
})

Fannie总结

  后面的方法要自己去实践哦,我用的是第一种。

  然后再次提醒一下,你们自家的服务器要支持这样传token哦~

  不然会报个错的,像下面这样

Request header field token is not allowed by Access-Control-Allow-Headers in preflight response.

  拜拜了。

vue+vue-resource设置请求头(带上token)的更多相关文章

  1. axios配置及使用(发起请求时带上token)

    1.安装 利用npm安装 npm install axios --save 2.引入即可使用 import axios from 'axios' 3.目录 4.各个文件设置: (1)env.js ex ...

  2. 原生js实现文件下载并设置请求头header

    原生js实现文件下载并设置请求头header const token="自行定义";//如果有 /** * 向指定路径发送下载请求 * @param{String} url 请求路 ...

  3. axios中为所有请求带上Token头

    axios中为所有请求带上Token头 https://www.imooc.com/article/27751

  4. 在AngularJs中怎么设置请求头信息(headers)及不同方法的比较

    在AngularJS中有三种方式可以设置请求头信息: 1.在http服务的在服务端发送请求时,也就是调用http()方法时,在config对象中设置请求头信息:事例如下: $http.post('/s ...

  5. 设置请求头解决浏览器同源问题,ajx跨域获取cookie问题

    思想: 添加过滤器 设置请求头 代码如下 import java.io.IOException; import javax.servlet.Filter; import javax.servlet.F ...

  6. axios设置请求头失效的问题

    前言:因为在使用vue-element-admin框架时遇到了设置请求头失效的问题,在后来发现是代理跨域问题,所以又简单理解了一下跨域. 出现的问题是我在axios拦截器上设置了请求头token,但是 ...

  7. SpringBoot图文教程17—上手就会 RestTemplate 使用指南「Get Post」「设置请求头」

    有天上飞的概念,就要有落地的实现 概念十遍不如代码一遍,朋友,希望你把文中所有的代码案例都敲一遍 先赞后看,养成习惯 SpringBoot 图文教程系列文章目录 SpringBoot图文教程1-Spr ...

  8. ajax中的setRequestHeader设置请求头

    1.问题引发点: 前不久发现一个问题: 前端并没有设置请求头信息里面的Accept-Encoding:gzip...但是在请求头中可以明显的看到Accept-Encoding:gzip, deflat ...

  9. ajax里post 设置请求头的编码格式

    我们常用的ajax形式就是post和get.post需要设置请求头,那么问题来了: 首先,为什么get不需要设置编码格式? 其次:不设置post请求头编码格式可以吗? 还有:常用的请求头编码格式有哪些 ...

随机推荐

  1. JavaScript HTML DOM元素节点常用操作接口

    在文档对象模型 (DOM) 中,每个节点都是一个对象.DOM 节点有三个重要的属性 : 1. nodeName : 节点的名称 2. nodeValue :节点的值 3. nodeType :节点的类 ...

  2. Centos7安装防火墙firewall

    安装 1.下载 yum install -y firewalld yum install -y firewall-config 2.启动 systemctl start firewalld # 启动 ...

  3. MySQL Connection--使用tcpkill杀掉MySQL活跃连接

    当MySQL连接被打满,连管理员也无法本地登录时,可以考虑使用tcpkill杀掉一些应用服务器创建的连接. CentOS 6安装tcpkill rpm安装包: libnids-1.24-1.el6.x ...

  4. RabbitMQ direct交换器

    1:队列和交换器多次绑定 String[] routekeys={"routekey1","routekey2","routekey3"}; ...

  5. Java8新特性Function、BiFunction使用

    闲话不多说,直接看代码,注释都写的很清楚了. package com; import java.util.function.BiFunction; import java.util.function. ...

  6. WEB安全工程师整理资料

    安全产品  NESS   Nmap   AWVS Burp APPScan   chopper  sqlmap   kali linux    具体的教程可以在SEcWiki 上搜索  使用公开的漏洞 ...

  7. 修改bash终端命令行颜色

    要修改linux终端命令行颜色,我们需要用到PS1,PS1是Linux终端用户的一个环境变量,用来说明命令行提示符的设置.在终端输入命令:#set,即可在输出中找到关于PS1的定义如下: PS1='[ ...

  8. LB_Yi

    LB_Yi 简述 LB_Yi也是一种比较常见的下界函数,在时间序列的筛选中十分常见.是由Yi在Kim的基础上设计的下界函数. 公式 LB_Yi的公式如下: 从公式中可以明显的看出,其实就是把大于序列最 ...

  9. DNS BIND配置 配置基本缓存服务器 DNS正向解析 DNS反向解析

    一. 缓存服务器配置 1.DNS:BIND    Berkeley Internet Name Domain    版本bind97: RPM服务器端包的名字  安装bind-libs    bind ...

  10. 渗透之路基础 -- XXE注入漏洞

    XXE漏洞 XXE漏洞全称XML External Entity Injection即xml外部实体注入漏洞,XXE漏洞发生在应用程序解析XML输入时,没有禁止外部实体的加载,导致可加载恶意外部文件, ...