解决前后端分离的“两次请求”引出的Web服务器跨域请求访问问题的解决方案
在前后端分离的项目中,前端和后端可能是在不同的服务器上,也可以是Docker上,那就意味着前端请求后端Restful接口时,存在跨域情况。
后端在做了通用的跨域资源共享CORS设置后,前端在做ajax跨域请求时,如果需要在自定义请求头中设置类似于Authorization认证属性时,
则该ajax请求就从简单请求变为复杂请求。CORS请求分成两类:1,简单请求。2。非简单请求
1、简单请求
1. 请求方法是以下三种方法之一: HEAD、GET、POST 2. HTTP的头信息不超出以下几种字段: Accept、Accept-Language、Content-Language、Last-Event-ID、Content-Type:只限于三个值application/x-www-form-urlencoded、multipart/form-data、text/plain。 这就意味着,如果请求中添加了自定义Header,就属于非简单请求,就需要Server端处理预检验(Option)请求。
2、非简单请求
非简单请求发送请求时,从浏览器端来看是浏览器发送了2次请求,第1次是option方法的请求,是预检请求;第2次是实际的请求。
浏览器会先发送一个options方法的ajax的预请求。
这时后端需要在拦截器或者过滤器里面设置允许options请求。设置自定义的请求头属性:Authorization


获取Response的自定义header
如果是跨域请求(CORS), 自定义的Header会从server端的response headers 带回浏览器,但始终将无法通过代码response.headers.get(“X-TOKEN”)取得, 拦截器或者过滤器必须要添加 “Access-Control-Expose-Headers” 到Response中才行。


解决前后端分离的“两次请求”引出的Web服务器跨域请求访问问题的解决方案的更多相关文章
- 由一个“两次请求”引出的Web服务器跨域请求访问问题的解决方案
http://blog.csdn.net/cnhnnyzhy/article/details/53128179 (4)Access-Control-Max-Age 该字段可选,用来指定本次预检请求的有 ...
- 利用gulp解决前后端分离的header/footer引入问题
在我们进行前后端完全分离的时候,有一个问题一直是挺头疼的,那就是公共header和footer的引入.在传统利用后端渲染的情况下,我们可以把header.footer写成两个单独的模板,然后用后端语言 ...
- 利用CORS解决前后端分离的跨域资源问题
CORS 即CrossOrigin Resources Sharing-跨域资源共享,它定义了一种浏览器和服务器交互的方式来确定是否允许跨域请求.它是一个妥协,有更大的灵活性,但比起简单地允许所有这些 ...
- 解决web资源跨域请求问题
参考地址: http://my.oschina.net/lichaoqiang/blog/317823 在浏览器请求中,出现跨域访问资源的问题,我们肯定会遇到.如果跨域请求被阻止,有可能导致css.j ...
- web api 跨域请求,ajax跨域调用webapi
1.跨域问题仅仅发生在Javascript发起AJAX调用,或者Silverlight发起服务调用时,其根本原因是因为浏览器对于这两种请求,所给予的权限是较低的,通常只允许调用本域中的资源,除非目标服 ...
- ASP.NET web api 跨域请求
1.学习文章:AJAX 跨域请求 - JSONP获取JSON数据 1.asp.net代码 参考文章:http://www.sxt.cn/info-2790-u-756.html (1).增加CorsH ...
- mock的使用及取消,node模仿本地请求:为了解决前后端分离,用户后台没写完接口的情况下
借鉴:https://www.jianshu.com/p/dd23a6547114 1.说到这里还有一种是配置node模拟本地请求 (1)node模拟本地请求: 补充一下 [1]首先在根目录下建一个d ...
- 解决前后端分离后的Cookie跨域问题
一. 前端Ajax关键配置 $.ajax({ type: "post", url: xxx, data: xxx, contentType: 'application/json', ...
- Nginx完美解决前后端分离端口号不同导致的跨域问题
笔者在做前后端分离系统时,出现了很多坑,比如前后端的url域名相同,但是端口号不同.例如前端页面为:http://127.0.0.1/ , 后端api根路径为 http://127.0.0.1:888 ...
随机推荐
- VIM使用技巧15
在vim的插入模式下,有时需要插入寄存器中的文本: 1.使用<C-r>{register} 2.使用<C-r><C-p>{register} 3.使用<C-r ...
- codeforces Gym 100971 A、B、C、F、G、K、L
A题 直接把问号全部变为陆地如果所有陆地连通 那么再逐个把刚才变成陆地的问号变为水如果依旧连通有多种解 为什么我的代码跑不过去,和网上的题解思路一模一样!!?? #include<cst ...
- hdu - 2660 Accepted Necklace (二维费用的背包问题)
http://acm.hdu.edu.cn/showproblem.php?pid=2660 f[v][u]=max(f[v][u],f[v-1][u-w[i]]+v[i]; 注意中间一层必须逆序循环 ...
- 【动态规划】最长上升子序列(LIS)
今天看了<挑战程序设计竞赛>的动态规划部分,感觉对以前一些知其然却不知其所以然的问题有了更好的理解,先整理一部分. 题意: 有一个长为n的数列a0,a1,a2,...,an .请求出这个序 ...
- 记一次springMVC的跨域解决方案
日期:2019年5月18日 事情原因:由于微信小程序的开发只有测试环境,而后台提供借口的环境是开发环境:两个环境的域名不同,导致前端开发产生了跨域问题: 理论概念: 1.同源策略:同源策略是浏览器的安 ...
- commons-lang常用工具类StringEscapeUtils
原文:https://my.oschina.net/mousai/blog/88832 在apache commons-lang(2.3以上版本)中为我们提供了一个方便做转义的工具类,主要是为了防止s ...
- python异步回调函数的实现
#coding:utf-8 from socket import * import time #简单的服务器程序 监听用户连接,接收用户发来的信息,并返回反馈 def main(): HOST = & ...
- psychology
壹.自身(荣.命) 一.职业分析 ㈠.分析性格→分析长处和短处→分析大家都有的长处→确定自己最终发展的专业. 1 .性格--宗正 耐压力特强,即使肩头责任重大,也能够处理得稳稳当当,是 ...
- STL之关联容器的映射底层
STL的关联容器有set, map, multiset, multimap.用于实现它们的底层容器有划入标准的rb_tree和待增加标准的hashtable. 底层容器rb_tree为上层容器提供了一 ...
- eventkeyboardmouse
http://www.javascriptkit.com/jsref/eventkeyboardmouse.shtml