跨域解决方案详解
来源:互联网 发布:知乎股份构成 编辑:程序博客网 时间:2024/06/01 19:06
概述
废话不想多讲,由于前篇整理了由前后端分离的3种方案,个人挑取了配置服务器的方案进行方案推进,结果数据是交互了,但是在header自定义token的cache上出了问题,自定义的header一直不能够传到server上。于是乎各种百度,google有了这篇帖子的衍生,学术不精,必须踩坑。
跨域请求CORS流程描述如下
OPTIONS验证服务器解决方案
在采用filter解决之前,查看了一些spring boot提供的cors提供的解决方案,在原理理解上一样,基本上为server端设置相应的header参数response给客户端来达到通信流程,如下code,filter”照顾”浏览器厂商CORS技术从而单独处理返回OPTIONS的验证header
public class DomainFilter implements Filter { @Override public void init(FilterConfig filterConfig) throws ServletException { } @Override public void doFilter(ServletRequest req, ServletResponse res, FilterChain chain) throws IOException, ServletException { HttpServletResponse response = (HttpServletResponse) res; response.setHeader("Access-Control-Allow-Origin", "*"); response.setHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS, DELETE"); response.setHeader("Access-Control-Max-Age", "3600"); response.addHeader("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept,X-XSRF-TOKEN"); chain.doFilter(req, res); } @Override public void destroy() { }}
总结
跨域终究还是浏览器衍生出来的问题,任何一门语言的http代理是木有的,一般出现场景都在浏览器的ajax请求中发生。我的理解,在出现跨域场景的时候,浏览器检测是跨域的请求,则会请求拆分为2,OPTIONS请求方式先行,为了验证服务器请求返回的header,允许的请求方式,允许传递的header等,这些参数都要在服务器端进行配置,相应的参数在http协议和浏览器之间交互完成之后,会报告是跨域不允许的交互,还是进行真实的2次交互。
阅读全文
2 0
- 跨域解决方案详解
- JavaScript跨域与解决方案详解
- 【Angular】angular 跨域解决方案详解
- SSO跨域解决方案
- SSO跨域解决方案
- iframe跨域解决方案
- 跨域请求解决方案
- 跨域请求解决方案
- 跨域解决方案
- 跨域的解决方案
- JS跨域解决方案
- 跨域解决方案
- ajax跨域解决方案
- 跨域及解决方案
- jsonp跨域解决方案
- Messager 跨域解决方案
- 跨域请求解决方案
- JSONP 跨域解决方案
- ModelMap和ModelAndView的作用
- ojdbc操作oracle时间类型字段的处理
- JS获取某月首尾日,获取某天某周的首位日
- 替换字符串中的空格
- TI—CC3200【1】独特的一步式WI-FI智能配置技术-SmartConfig测试
- 跨域解决方案详解
- 通过字节码扒一扒java编译器瞒着我们做了什么(1)
- JS的array.slice()和array.splice()的使用
- PHP代码如何被执行?
- github第二弹
- NodeIo
- SQLSERVER导入CSV表数据
- 大话大前端时代(一) —— Vue 与 iOS 的组件化
- 【剑指offer】面试题18:删除链表中重复的节点