什么是跨域请求
- 在前端开发编码过程中，常见的HTML标签例如：a、form、img、script、link、iframe以及ajax操作都可以指向一个资源地址或者说发起一个资源请求，那么这里所说的请求就存在同域请求和跨域请求。
- 所谓跨域请求就是指：当前发起请求的域与该请求所指向的资源所在的域不一致(协议、域名、端口，任意一个不一样都会导致)。
跨域请求为什么出现在前端中
- 既然同源策略是浏览器的核心基础安全策略，那为什么我们在进行前端开发特别是Ajax调用时还要进行跨域请求呢?同源策略是用来防御来自非法的攻击，但我们不能因为防御非法的攻击就将所有的跨域都拦截掉。
- 在现代前端开发中，我们经常需要调用第三方的服务接口(例如mock server、fake api)，随着专业化分工的出现有很多专业的信息服务提供商为前端开发者提供各类接口，这种情况下就需要进行跨域请求(这类前端接口服务很多是采用的cors方式来解决跨域问题的，下文会详细介绍)。
- 还有一类情况是在前后端分离的项目中，前端后端分属于不同的服务跨域问题在采用这种架构的时候就存在。而且现在很多项目都采用这种前后分离的方式，这类项目很多是会采用反向代理的方式来解决跨域问题。
跨域请求解决方案
- 修改浏览器的安全设置(不推荐)
- JSONP(只能通过get方式)
- 跨域资源共享CORS(Cross-Origin Resource Sharing)
- iframe（不推荐）
- 反向代理
JSONP
- JSONP(JSON with Padding)是JSON的一种使用模式，可用于解决主流浏览器的跨
域数据访问问题，在早两三年前端解决跨域问题中经常出现这类解决方案。 - JSONP的原理就是，Ajax.存在跨域安全问题但是script标签是不存在这类问题的，
于是乎就有人根据这个特性做文章找解决方案。
跨域资源共享CORS(Cross-Origin Resource Sharing)
- CORS是一个新的W3C标准，它新增的一组HTTP首部字段允许服务器其声明哪些来源请求有权限访问哪些资源，换言之它允许浏览器向其声明了CORS的站进行跨域请求。
- 这种方式最主要的特点就是会在响应的HTTP首部增加
Access-Control-Allow-Origin等信息，从而判定哪些资源站可以进行跨域请求，还有几个其他相关的HTTP首部进行更加精细化的控制，最主要的还是Access-Control-Allow-Origin。具体每个首部信息的含义可以去搜索详细了解下。 - CORS与JSONP对比来说优势比较明显，JSONP只支持GET方式局限性很多，而且
JSONP并不符合处理业务的正常流程。采用CORS的方式，前端编码与正常非跨域请求
没有什么不同。在目前很多的Fake API (模拟接口服务)、Mock Server(数据模拟服务)以及其他公共服务上都很多采用CORS的方式来解决跨域问题,例如json-server等。
反向代理
- 既然不能跨域请求，那么我们不跨域就可以了。通过在请求到达服务前部署一
个服务，将接口请求进行转发，这就是反向代理。通过一定的转发规则可以将
前端的请求转发到其他的服务。以Nginx为例:
- 通过反向代理我们将前端后端项目统一通过反向代理来提供对外的服务，这样
在前端看上去就跟不存在跨域一样。 - 反向代理麻烦之处就在原对Nginx等反向代理服务的配置，在目前前后端分离
的项目中很多都是采用这种方式。
总结：
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请联系我们举报，一经查实，本站将立刻删除。
发布者：全栈程序员-站长，转载请注明出处：https://javaforall.net/216585.html原文链接：https://javaforall.net
