前后端如何跨域?

水深无声 2022-03-15 13:22 282阅读 0赞

## **跨域是什么?** ##

跨域就是跨协议,跨域名,跨端口;

*  跨协议:https//;
 *  跨域名:yuanting.com;
 *  跨端口:8080;  
    (同源就是同协议,同域名,同端口)  
    详细请关注这位大佬鼠的博客:[跨域和同源][Link 1]  
    [https://www.cnblogs.com/shirly77/p/6440635.html?utm\_source=itdadao&utm\_medium=referral][Link 1]

## 服务器端解决跨域 ##

跨域的允许主要由服务器端控制。服务器端通过在响应的 header 中设置 Access-Control-Allow-Origin 及相关一系列参数，提供跨域访问的允许策略。

*  通过在响应 header 中设置 ‘\*’ 来允许来自所有域的跨域请求访问。

response.setHeader("Access-Control-Allow-Origin", "*");

*  只允许来自特定域 [http://my.yuanting:8080][http_my.yuanting_8080] 的跨域访问

response.setHeader("Access-Control-Allow-Origin", "http://my.yuanting.cn:8080");

*  较灵活的设置方式，允许所有包含 [mydomain.com][] 的域名访问.

if(request.getHeader("Origin").contains("mydomain.com")) {
        response.setHeader("Access-Control-Allow-Origin", request.getHeader("Origin"));
    }

再次附上另外一只大老鼠的博客详细了解跨域问题[Ajax跨域请求][Ajax]\`  
[https://blog.csdn.net/z69183787/article/details/78954325][Ajax]

在拦截器 或者每个方法中加入这三句代码就可以解决跨域问题

response.setHeader("Access-Control-Allow-Credentials", "true");//访问控制控允许凭据
    		response.setHeader("Access-Control-Allow-Origin",request.getHeader("Origin"));//访问控制允许来源ip地址
    		response.setHeader("Access-Control-Allow-Headers","content-type");//访问控制控允许报头

[Link 1]: https://www.cnblogs.com/shirly77/p/6440635.html?utm_source=itdadao&utm_medium=referral
[http_my.yuanting_8080]: http://my.yuanting:8080
[mydomain.com]: http://mydomain.com
[Ajax]: https://blog.csdn.net/z69183787/article/details/78954325