1 概念

2 案例

3 解决

4 实现

5 什么是跨域问题

示意图

1 概念

• 协议相同
• 域名相同
• 端口相同

只有有任何一个地方不同，就认为是跨域。 如果非同源（跨域）会受到 AJAX 请求不能发送

• 公司内部有多个不同的子系统，例如A和B，分别部署在不同的服务器上，其域名也不相同
• 由于公司内部的数据需要，现在A系统中，跨域访问B系统，从而获取内部的一些信息资源

2 案例

• pom.xml

<dependency> 
<groupId>org.springframework.boot</groupId> 
<artifactId>spring-boot-starter-web</artifactId> 
</dependency> 
<dependency> 
<groupId>org.springframework.boot</groupId> 
<artifactId>spring-boot-starter-thymeleaf</artifactId> 
</dependency>

•  HellController.java

 2. 创建springboot_ajax项目

• AjaxController.java

 3. 访问springboot_html项目的index.html

 4. 点击按钮发送ajax请求访问springboot_ajax项目的接口

 原因：CORS 头缺少 'Access-Control-Allow-Origin' :

3 解决

• 整个CORS通信过程，都是浏览器自动完成，不需要用户参与。
• 对于开发者来说，CORS通信与同源的AJAX通信没有差别，代码完全一样。
• 浏览器一旦发现AJAX请求跨源，就会自动添加一些附加的头信息。（Origin）
• 有时还会多出一次附加的请求，但用户不会有感觉。（options方式的请求）

• 简单请求（simple request）
• 非简单请求（not-so-simple request）

• application/x-www-form-urlencoded
• multipart/form-data
• text/plain

注意，只要不能同时满足上面两个条件，就属于非简单请求。

4 实现

5 什么是跨域问题

1. 跨域，指的是浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的，是浏览器施加的安全限制。最简单的说就是从当前域名的网站下不能请求非同源的地址

所谓同源是指，域名，协议，端口均相同，只要有一个不同，就是跨域。

请特别注意：跨域问题是针对于浏览器的，因为需要解决的跨域问题，是浏览器施加的安全限制所造成的。

2. 跨域是指跨域名的访问，有三种情况：

1. 域名不同的跨域。
2. 域名相同、端口不同的跨域。
3. 二级域名不同的跨域。

3. 举例说明:

http://www.123.com/index.html 调用 http://www.123.com/server.php （非跨域）

http://www.123.com/index.html 调用 http://www.456.com/server.php （主域名不同:123/456，跨域）

http://abc.123.com/index.html 调用 http://def.123.com/server.php （子域名不同:abc/def，跨域）

http://www.123.com:8080/index.html 调用 http://www.123.com:8081/server.php （端口不同:8080/8081，跨域）

http://www.123.com/index.html 调用 https://www.123.com/server.php （协议不同:http/https，跨域）

请注意：localhost和127.0.0.1虽然都指向本机，但也属于跨域。

4. 跨域会阻止什么操作？

浏览器是从两个方面去做这个同源策略的

一是：针对接口的请求 

二是：针对Dom的查询

这点就能够很好的防止别人把你经常访问的网页嵌入到iframe中来获取你的个人信息，比如a页面中嵌入了iframe，src为不同源的b页面，则在a中无法操作b中的dom，也没有办法改变b中dom中的css样式。