1、通过允许跨域访问实现了跨域请求,但为了使每个请求带上session信息,我设置了withCredentials ,即:
  axios.defaults.withCredentials = true
  然后跨域请求时会出现如下问题:
  Response to preflight request doesn't pass access control check: The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'. Origin 'http://localhost:8080' is therefore not allowed access. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.
  解决方案
    Access-Control-Allow-Origin 字段必须指定域名,不能为*
    Access-Control-Allow-Credentials为true

2.CORS
  同域安全策略CORS(Cross-Origin Resource Sharing)
  它要求请求的服务器在响应的报头(Response Header)添加 Access-Control-Allow-Origin标签,从而允许此标签所对应域访问此服务器的资源,调用此服务器的接口。
  缺陷:

    默认情况下,跨源请求不提供凭据(cookie、HTTP认证及客户端SSL证明等),通过将withCredentials属性设置为true,可以指定某个请求应该发送凭据。如果服务器接收带凭据的请求,会用下面的HTTP头部来响应:

1 Access-Control-Allow-Credentials: true

  如果发送的是带凭据的请求,但服务器的相应中没有包含这个头部,那么浏览器就不会把相应交给JavaScript,请求就无法得到结果的数据(浏览器得到了,但是我们请求的方法得不到,因为被浏览器拦截了),因此在需要传Cookie等时,服务端的Access-Control-Allow-Origin必须配置具体的具体的域名。并且还需要设置其他的请求头:

1
2
3
4
header('Access-Control-Allow-Origin:http://www.xxx.com');
header('Access-Control-Allow-Credentials: true');   //是否支持cookie跨域
header('Access-Control-Allow-Methods: GET, POST, PUT, DELETE, OPTIONS');
header("Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept");

axios 跨域请求允许带cookie,则服务器Access-Control-Allow-Origin应设置为具体域名,否则请求无法获得返回数据的更多相关文章

  1. 使用ajax请求接口,跨域后cookie无法设置,全局配置ajax;及使用axios跨域后cookie无法设置,全局配置axios

    问题一: 使用ajax/axios跨域请求接口,后端放行了,能够正常获取数据,但是cookie设置不进去,后端登录session判断失效 ajax解决办法: //设置ajax属性 crossDomai ...

  2. [转] js网络请求跨域问题汇总(携带cookie)

    前端程序使用extjs写,在本地测试,发送请求到服务器时,发现存在跨域的问题,cookie也没有set成功,于是乎在这里整理一下解决过程 由于篇幅较长,不想看解决过程的可以翻到最后看总结1.跨域允许2 ...

  3. vue-cli axios跨域 + 反向代理模拟http请求host+referer

    axios跨域 配置config->index.js中的proxyTable,内容如下: proxyTable: { // 跨域请求 '/api': { // 注意此处可设置为 '*' 代表不限 ...

  4. $Django 前后端之 跨域问题(同源策略) vue项目(axios跨域请求数据)

    1 跨域问题(多个域之间的数据访问) #同源策略(ip port 协议全部相同) #本站的只能请求本站域名的数据 #CORS实现(跨域资源共享) #实现CORS通信的关键是服务器.只要服务器实现了CO ...

  5. vue axios跨域请求,apache服务器设置

    问题所在axios请求会发送两次请求 也就是说,它会先使用options去测试,你这个接口是否能够正常通讯,如果不能就不会发送真正的请求过来,如果测试通讯正常,则开始正常请求. 思路: 跨域--> ...

  6. axios,vue-echarts, async, vue 图表数据处理; axios 跨域代理; 异步同步请求接口;生命周期函数

    1.vue-echarts 安装和组件引用 插件官网 https://github.com/ecomfe/vue-echarts 安装 npm install eacharts vue-echarts ...

  7. Vue用axios跨域访问数据

    Vue用axios跨域访问数据axios是vue-resource的替代品,vue-resource不再维护.安装axios:npm install axios使用vue-cli开发时,由于项目本身启 ...

  8. jquery + node 通过 CORS 实现跨域访问,支持cookie和自定义header

    跨域有多种方式,现在的情况看来还是CORS更适合一些,有很多优点,比如浏览器正式支持.支持post.可以控制跨域访问的网站等. 我们来看看node如何实现cors方式的跨域.在网上找到了一些代码,考过 ...

  9. axios跨域问题(包括开发环境和生产环境)

    之前写过一篇axios跨域问题,写的过于片面,没有考虑过实际开发中遇到的问题,以及如何全局使用axios,这次再写一篇,以后再有新发现再更新... 1.在static文件夹下新建/js/config. ...

随机推荐

  1. VMware复制Linux虚拟机后网络配置

    1.启动虚拟机,点击我已复制 点击已复制后,VMware将会为重置虚拟机网卡mac地址. 2.修改网卡mac地址 3.ifconfig显示网卡名称与配置不一致处理 Centos6中ifconfig显示 ...

  2. JVM解毒——类加载子系统

    带着问题,尤其是面试问题的学习才是最高效的.加油,奥利给! 点赞+收藏 就学会系列,文章收录在 GitHub JavaEgg ,N线互联网开发必备技能兵器谱 直击面试 看你简历写得熟悉JVM,那你说说 ...

  3. 我一个二本大学是如何校招拿到阿里offer的

    作者:薛勤,互联网从业者,编程爱好者. 本文首发自公众号:代码艺术(ID:onblog)未经许可,不可转载 01:终于步入大学 我既没有跨过山和大海,也没有穿过人山人海,我就是我,一个普通本科大学生. ...

  4. 使用github--stanfordnlp--glove训练自己的数据词向量

    1.准备语料 准备好自己的语料,保存为txt,每行一个句子或一段话,注意要分好词.将分好词的语料保存为×××.txt 2.准备源码 下载地址:https://github.com/stanfordnl ...

  5. 详解CopyOnWrite容器及其源码

    详解CopyOnWrite容器及其源码 在jave.util.concurrent包下有这样两个类:CopyOnWriteArrayList和CopyOnWriteArraySet.其中利用到了Cop ...

  6. 无线网络WPA加密算法基础

    2013-11-13 23:08 (分类:网络安全) 对无线没什么认识,总听说有人蹭网,还有卖蹭网器的,于是补充一下知识. 无线加密有两类:WEP WAP,目前采用WEP加密的非常少了,WEP应该只是 ...

  7. 使用Python爬虫库BeautifulSoup遍历文档树并对标签进行操作详解(新手必学)

    为大家介绍下Python爬虫库BeautifulSoup遍历文档树并对标签进行操作的详细方法与函数下面就是使用Python爬虫库BeautifulSoup对文档树进行遍历并对标签进行操作的实例,都是最 ...

  8. 在服务器上搭建远端git仓库

    推荐使用运行Liunx的机器 请获取root权限后进行下面操作 安装git # 检查是否安装了git如果有版本号就无需再安装 git -v # 安装git sudo apt-get install g ...

  9. count(1)比count(*)效率高?

    SELECT COUNT(*) FROM table_name是个再常见不过的统计需求了. 本文带你了解下Mysql的COUNT函数. 一.COUNT函数 关于COUNT函数,在MySQL官网中有详细 ...

  10. 【转载】sql-builder介绍

    原文链接:sql-builder介绍 关于sql-builder sql-builder尝试使用java对象,通过类SQL的拼接方式,动态快速的生成SQL.它可作为稍后的开源项目ibit-mybati ...