一、跨域背景

1.1 何为跨域？

Url的一般格式：

协议 + 域名（子域名 + 主域名） + 端口号 + 资源地址

示例：

https://www.dustyblog.cn:8080/say/Hello 是由

https + www + dustyblog.cn + 8080 + say/Hello
组成。

只要协议，子域名，主域名，端口号这四项组成部分中有一项不同，就可以认为是不同的域，不同的域之间互相访问资源，就被称之为跨域。

1.2 一次正常的请求

• Controller层代码：

@RequestMapping("/demo") @RestController public class CorsTestController {      @GetMapping("/sayHello")     public String sayHello() {         return "hello world !";     } }

• 启动项目，测试请求

浏览器打开localhost:8080/demo/sayHello

可以打印出“hello world”

1.3 跨域测试

以Chrome为例：

• 打开任意网站，如：https://blog.csdn.net

• 按F12，打开【开发者工具】，在里面的【Console】可以直接输入js代码测试；

var token= "LtSFVqKxvpS1nPARxS2lpUs2Q2IpGstidMrS8zMhNV3rT7RKnhLN6d2FFirkVEzVIeexgEHgI/PtnynGqjZlyGkJa4+zYIXxtDMoK/N+AB6wtsskYXereH3AR8kWErwIRvx+UOFveH3dgmdw1347SYjbL/ilGKX5xkoZCbfb1f0=,LZkg22zbNsUoHAgAUapeBn541X5OHUK7rLVNHsHWDM/BA4DCIP1f/3Bnu4GAElQU6cds/0fg9Li5cSPHe8pyhr1Ii/TNcUYxqHMf9bHyD6ugwOFTfvlmtp6RDopVrpG24RSjJbWy2kUOOjjk5uv6FUTmbrSTVoBEzAXYKZMM2m4=,R4QeD2psvrTr8tkBTjnnfUBw+YR4di+GToGjWYeR7qZk9hldUVLlZUsEEPWjtBpz+UURVmplIn5WM9Ge29ft5aS4oKDdPlIH8kWNIs9Y3r9TgH3MnSUTGrgayaNniY9Ji5wNZiZ9cE2CFzlxoyuZxOcSVfOxUw70ty0ukLVM/78="; var xhr = new XMLHttpRequest(); xhr.open('GET', 'http://127.0.0.1:8080/demo/sayHello'); xhr.setRequestHeader("x-access-token",token); xhr.send(null); xhr.onload = function(e) {     var xhr = e.target;     console.log(xhr.responseText); }

• 输入完后直接按回车键就可以返回结果:

Access to XMLHttpRequest at 'http://127.0.0.1:8080/demo/sayHello'  from origin 'https://blog.csdn.net' has been blocked by CORS policy:  No 'Access-Control-Allow-Origin' header is present on the requested resource.

该结果表明：该请求在