axios 跨域请求允许带cookie,则服务器Access-Control-Allow-Origin应设置为具体域名,否则请求无法获得返回数据
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应设置为具体域名,否则请求无法获得返回数据的更多相关文章
- 使用ajax请求接口,跨域后cookie无法设置,全局配置ajax;及使用axios跨域后cookie无法设置,全局配置axios
问题一: 使用ajax/axios跨域请求接口,后端放行了,能够正常获取数据,但是cookie设置不进去,后端登录session判断失效 ajax解决办法: //设置ajax属性 crossDomai ...
- [转] js网络请求跨域问题汇总(携带cookie)
前端程序使用extjs写,在本地测试,发送请求到服务器时,发现存在跨域的问题,cookie也没有set成功,于是乎在这里整理一下解决过程 由于篇幅较长,不想看解决过程的可以翻到最后看总结1.跨域允许2 ...
- vue-cli axios跨域 + 反向代理模拟http请求host+referer
axios跨域 配置config->index.js中的proxyTable,内容如下: proxyTable: { // 跨域请求 '/api': { // 注意此处可设置为 '*' 代表不限 ...
- $Django 前后端之 跨域问题(同源策略) vue项目(axios跨域请求数据)
1 跨域问题(多个域之间的数据访问) #同源策略(ip port 协议全部相同) #本站的只能请求本站域名的数据 #CORS实现(跨域资源共享) #实现CORS通信的关键是服务器.只要服务器实现了CO ...
- vue axios跨域请求,apache服务器设置
问题所在axios请求会发送两次请求 也就是说,它会先使用options去测试,你这个接口是否能够正常通讯,如果不能就不会发送真正的请求过来,如果测试通讯正常,则开始正常请求. 思路: 跨域--> ...
- axios,vue-echarts, async, vue 图表数据处理; axios 跨域代理; 异步同步请求接口;生命周期函数
1.vue-echarts 安装和组件引用 插件官网 https://github.com/ecomfe/vue-echarts 安装 npm install eacharts vue-echarts ...
- Vue用axios跨域访问数据
Vue用axios跨域访问数据axios是vue-resource的替代品,vue-resource不再维护.安装axios:npm install axios使用vue-cli开发时,由于项目本身启 ...
- jquery + node 通过 CORS 实现跨域访问,支持cookie和自定义header
跨域有多种方式,现在的情况看来还是CORS更适合一些,有很多优点,比如浏览器正式支持.支持post.可以控制跨域访问的网站等. 我们来看看node如何实现cors方式的跨域.在网上找到了一些代码,考过 ...
- axios跨域问题(包括开发环境和生产环境)
之前写过一篇axios跨域问题,写的过于片面,没有考虑过实际开发中遇到的问题,以及如何全局使用axios,这次再写一篇,以后再有新发现再更新... 1.在static文件夹下新建/js/config. ...
随机推荐
- DFS判断图是否有环
利用_DFS_来判断无向图是否存在环的条件思路,我看一次_DFS_是否能访问到之前访问到的节点,如果能够访问到,就说明图存在环,那么关键问题就是判断是一次DFS?,追根到_DFS_算法的实现细节, ...
- 编写windows服务程序
2012-11-02 08:54 (分类:计算机程序) windows服务是一个运行在后台并实现勿需用户交互的任务的控制台程序,对于隐藏程序有很大帮助. 用了几天时间概括了编写windows服务程序的 ...
- 浅谈.NET中AppDomain的理解
一.走进.NET AppDomain 天哪,.NET Framwork的CLR真是巧妙呢!随着越来越多的对.Net底层编程的了解,一些诸如架构,处理过程的复杂难懂的细节完全的让我叹服,所以呢,再次错过 ...
- NIO-WindowsSelectorImpl源码分析
目录 NIO-WindowsSelectorImpl源码分析 目录 前言 初始化WindowsSelectorProvider 创建WindowsSelectorImpl WindowsSelecto ...
- 软件测试常见术语(英->汉)收藏好随时备用!
Defect 缺陷Defect Rate 缺陷率Verification & Validation 验证和确认Failure 故障White-box Testing 白盒测试Black-box ...
- DataX的使用——大数据同步技术
准备工作: 1.视频教学http://113.31.104.47/portal/#/course/dashboard/b34d160db64624732ef152a1118af11a 2.DataX的 ...
- Dijkstra算法2
// 再来一手精髓的Dijkstra // 复杂度O( E*log(V) ) #include <cstdio> #include <iostream> #include &l ...
- com.google.gson json字符串的序列化与反序列化
经常做协议的时候用到json,个人习惯是定义协议文档,很少在这中场景中定义类,使用对象. 这里使用一个人物有名字,性别,有一个物品列表做个简单示例记录. 序列化 JsonObject jo=new J ...
- SSH-Secure-Shell 3.2.9 build283版本,创建直接打开文件传输的快捷方式的方法
2019-12-31 16:21:23 版本信息: 在安装目录下新建快捷方式 目标填写:"D:\SSH-Secure-Shell\SshClient.exe" /f 图标选择,系统 ...
- iMacros 入门教程-基础函数介绍(4)
imacros的TRAY函数用法 这个函数的功能就是隐藏或显示,当执行imacros文件的时候,出现在特定标签的imacros图标 TRAY HIDE 就是隐藏图标 TRAY SHOW 就是显示图标 ...