什么是跨域？怎么解决跨域问题？

墨蓝 2022-03-20 15:19 304阅读 0赞

什么是跨域？

跨域，指的是浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的，是浏览器施加的安全限制。

所谓同源是指，域名，协议，端口均相同，不明白没关系，举个栗子：

[http://www.123.com/index.html][http_www.123.com_index.html] 调用 [http://www.123.com/server.php][http_www.123.com_server.php] （非跨域）

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

[http://abc.123.com/index.html][http_abc.123.com_index.html] 调用 [http://def.123.com/server.php][http_def.123.com_server.php] （子域名不同:abc/def，跨域）

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

[http://www.123.com/index.html][http_www.123.com_index.html] 调用 [https://www.123.com/server.php][https_www.123.com_server.php] （协议不同:http/https，跨域）

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

浏览器执行javascript脚本时，会检查这个脚本属于哪个页面，如果不是同源页面，就不会被执行。

解决办法：

1、JSONP：

使用方式就不赘述了，但是要注意JSONP只支持GET请求，不支持POST请求。

2、代理：

[例如www.123.com/index.html需要调用www.456.com/server.php，可以写一个接口www.123.com/server.php，由这个接口在后端去调用www.456.com/server.php并拿到返回值，然后再返回给index.html，这就是一个代理的模式。相当于绕过了浏览器端，自然就不存在跨域问题。][www.123.com_index.html_www.456.com_server.php_www.123.com_server.php_www.456.com_server.php_index.html]

3、PHP端修改header（XHR2方式）

在php接口脚本中加入以下两句即可：

header(‘Access-Control-Allow-Origin:\*’);//允许所有来源访问

## header(‘Access-Control-Allow-Method:POST,GET’);//允许访问的方 ##

作者：L瑜  
来源：CSDN  
原文：[https://blog.csdn.net/lambert310/article/details/51683775][https_blog.csdn.net_lambert310_article_details_51683775]  
版权声明：本文为博主原创文章，转载请附上博文链接！

--------------------

## 使用Nginx代理来解决跨域问题 ##

推荐使用Nginx代理来解决跨域问题，具体的用法参考我的博客：[Nginx配置前后端分离项目代理–解决跨域问题][Nginx]

[http_www.123.com_index.html]: http://www.123.com/index.html
[http_www.123.com_server.php]: http://www.123.com/server.php
[http_www.456.com_server.php]: http://www.456.com/server.php
[http_abc.123.com_index.html]: http://abc.123.com/index.html
[http_def.123.com_server.php]: http://def.123.com/server.php
[http_www.123.com_8080_index.html]: http://www.123.com:8080/index.html
[http_www.123.com_8081_server.php]: http://www.123.com:8081/server.php
[https_www.123.com_server.php]: https://www.123.com/server.php
[www.123.com_index.html_www.456.com_server.php_www.123.com_server.php_www.456.com_server.php_index.html]: http://xn--www-uc0ep96b.123.com/index.html%E9%9C%80%E8%A6%81%E8%B0%83%E7%94%A8www.456.com/server.php%EF%BC%8C%E5%8F%AF%E4%BB%A5%E5%86%99%E4%B8%80%E4%B8%AA%E6%8E%A5%E5%8F%A3www.123.com/server.php%EF%BC%8C%E7%94%B1%E8%BF%99%E4%B8%AA%E6%8E%A5%E5%8F%A3%E5%9C%A8%E5%90%8E%E7%AB%AF%E5%8E%BB%E8%B0%83%E7%94%A8www.456.com/server.php%E5%B9%B6%E6%8B%BF%E5%88%B0%E8%BF%94%E5%9B%9E%E5%80%BC%EF%BC%8C%E7%84%B6%E5%90%8E%E5%86%8D%E8%BF%94%E5%9B%9E%E7%BB%99index.html%EF%BC%8C%E8%BF%99%E5%B0%B1%E6%98%AF%E4%B8%80%E4%B8%AA%E4%BB%A3%E7%90%86%E7%9A%84%E6%A8%A1%E5%BC%8F%E3%80%82%E7%9B%B8%E5%BD%93%E4%BA%8E%E7%BB%95%E8%BF%87%E4%BA%86%E6%B5%8F%E8%A7%88%E5%99%A8%E7%AB%AF%EF%BC%8C%E8%87%AA%E7%84%B6%E5%B0%B1%E4%B8%8D%E5%AD%98%E5%9C%A8%E8%B7%A8%E5%9F%9F%E9%97%AE%E9%A2%98%E3%80%82
[https_blog.csdn.net_lambert310_article_details_51683775]: https://blog.csdn.net/lambert310/article/details/51683775
[Nginx]: https://blog.csdn.net/qq_28379809/article/details/86532753