解决前后端调用,跨域二次请求Access-Control-Max-Age
发现前后端分离的项目中,前端发起一个请求到后端,在Chrome浏览器下面debug的时候,Network下面看到同一个url有两条请求,url有两条请求,第一条请求的Method为OPTIONS,第二条请求的Method才是真正的Get或者Post,并且,第一条请求无数据返回,第二条请求才返回正常的数据,我们的整个后台解决跨域问题是用CORS实现的,后来查资料发现原因:
第一个OPTIONS的请求是由WEB服务器处理跨域访问引发的。OPTIONS是一种预检请求,浏览器在处理跨域访问的请求时,如果判断请求为复杂请求,则会先向服务器发送一条预检请求,根据服务器返回的内容,浏览器判断服务器是否允许访问该请求。如果WEB服务器采用CORS的方式支持跨域访问,在处理复杂请求时这个预检请求是不可避免的。
由于我们的WEB服务器采用CORS来解决跨域访问的问题,同时在header中添加了自定义参数以及使用json格式来进行数据交互,导致我们的每次请求都是复杂请求,从而产生每次请求都会发送两条请求的现象。
产生原因如下:
使用CORS解决跨域问题
解决方案:
配置Nginx, 加入”Access-Control-Max-Age”,用来指定本次预检请求的有效期,单位为秒。上面结果中,有效期是20天(1728000秒),即允许缓存该条回应1728000秒(即20天),在此期间,不用发出另一条预检请求
location /wechat/ {
add_header ‘Access-Control-Max-Age’ 1728000;
proxy_pass http://wechat/rest/;
}
在nginx下面加入Access-Control-Max-Age,如果你的Chrome浏览器在debug状态,勾选上Disable cache,也是失效的
---------------------
作者:Java-Basketball
来源:CSDN
原文:https://blog.csdn.net/superdangbo/article/details/82685694
版权声明:本文为博主原创文章,转载请附上博文链接!
解决前后端调用,跨域二次请求Access-Control-Max-Age的更多相关文章
- nginx配置反向代理解决前后端分离跨域问题
摘自<AngularJS深度剖析与最佳实践>P132 nginx配置文件如下: server { listen ; server_name your.domain.name; locati ...
- nginx-springboot-vue前后端分离跨域配置
nginx-springboot-vue前后端分离跨域配置 引言 接着上篇--简单的springboot-vue前后端分离登录Session拦截的demo,其中跨域是通过springboot后端全局设 ...
- Nginx 解决WebApi跨域二次请求以及Vue单页面问题
一.前言 由于项目是前后端分离,API接口与Web前端 部署在不同站点当中,因此在前文当中WebApi Ajax 跨域请求解决方法(CORS实现)使用跨域处理方式处理而不用Jsonp的方式. 但是在一 ...
- nginx反向代理实现前后端分离&跨域问题
1.代理和跨域 1.1 正向代理 1)用户希望代理服务器帮助其和要访问服务器之间实现通信,需要: a.用户IP报文的目的IP=代理服务器IP: b.用户报文端口号=代理服务器监听端口号: c.HTTP ...
- 关于.Net Core 前后端分离跨域请求时 ajax并发请求导致部分无法通过验证解决办法。
项目中有这样一个页面.页面加载的时候会同时并发6个ajax请求去后端请求下拉框. 这样会导致每次都有1~2个“浏览器预请求”不通过. 浏览器为什么会自动发送“预请求”?请看以面连接 https://b ...
- Django前后端分离跨域请求问题
一.问题背景 之前使用django+vue进行前后端分离碰到跨域请求问题,跨域(域名或者端口不同)请求问题的本质是由于浏览器的同源策略导致的,当请求的响应不是处于同一个域名和端口下,浏览器不会接受响应 ...
- 前后端分离跨域 关于前后端分离开发环境下的跨域访问问题(angular proxy=>nginx )
前后端分离后遇到了跨域访问的问题: angular1中使用proxy很麻烦,最后还是失败结束:最后总结3种方法如下: 本人使用的第一种方法,只是开发环境下使用很方便! 1:禁掉谷歌的安全策略(Turn ...
- Java前后端的跨域问题
1 前端127.0.0.1:8888 2 后端127.0.0.1:8080 前端和后端因为来自不同的网域,所以在http的安全协议策略下,不信任 3 解决方案,在springmvc的控制层加入@Cro ...
- $Django 前后端之 跨域问题(同源策略) vue项目(axios跨域请求数据)
1 跨域问题(多个域之间的数据访问) #同源策略(ip port 协议全部相同) #本站的只能请求本站域名的数据 #CORS实现(跨域资源共享) #实现CORS通信的关键是服务器.只要服务器实现了CO ...
随机推荐
- C#数组2(多维数组)
using System; namespace ConsoleApp3 { struct WuGong { public string Name; public int Attack; } class ...
- python基础(16):内置函数(二)
1. lamda匿名函数 为了解决⼀些简单的需求⽽设计的⼀句话函数 # 计算n的n次⽅ def func(n): return n**n print(func(10)) f = lambda n: n ...
- 你见过的最全面的 Python 重点
由于总结了太多的东西,所以篇幅有点长,这也是我"缝缝补补"总结了好久的东西. Py2 VS Py3 print成为了函数,python2是关键字 不再有unicode对象,默认st ...
- Java生鲜电商平台-商城后台架构与原型图实战
Java生鲜电商平台-商城后台架构与原型图实战 说明:生鲜电商平台的运营平台,其中需要很多的功能进行管理.目前把架构与原型图实战分享给大家,希望对大家有用. 仪表盘/首页,简单统计,报表页,运营快捷口 ...
- C# ZedGraph实时多条曲线数据更新实例
C# ZedGraph实时多条曲线数据更新实例 先看展示效果 1.创建曲线实例添加必要的元素 public class LineChannel { public LineChannel(int id, ...
- 从0系统学 Android--1.1认识 Android
一转眼工作也有几年的时间了,一直想沉下心来,再回过头来重新系统的学习一遍 Android.所以就有了这个读书笔记.俗话说温故而知新,下面就请大家再跟着我系统的学习一篇 Android 吧! 这一系列主 ...
- [b0038] python 归纳 (二三)_多进程数据共享和同步_队列Queue
1 队列读写 # -*- coding: utf-8 -*- """ 多进程 共享 队列 multiprocessing.Process 逻辑: 一个进程往队列写数据, ...
- [b0003] 总览:Hadoop 个人学习路线进展
3. Spark 搭建 过 1.1 搭建伪分布式2.0.1 ok 2016-10-23 耗时 2h ref [0006] Spark 2.0.1 伪分布式搭建练手 后续: 1.2 分布 ...
- gdb x命令使用方法
x命令是直接查看指定地址为开头的内存里的内容 既然是要看,就分你想怎么看,和看多少 怎么看: d 按十进制格式显示 x 按十六进制格式显示 a 按十六进制格式显示 u 按十六进制格式显示无符号整型 o ...
- [Linux] deepin系统添加PHP仓库源出错Error: could not find a distribution template for Deepin/stable
aptsources.distro.NoDistroTemplateException: Error: could not find a distribution template for Deepi ...