浏览器拦截跨域请求处理方法(同源策略不允许读取服务器远程资源)

时间:2022-08-28 16:06:17

如题目所示,当浏览器进行跨域请求时,会出现跨域问题。

该问题在 Firefox 中会报错:

已拦截跨源请求:同源策略禁止读取位于 http://XXXX/x 的远程资源。(原因:CORS 头缺少 'Access-Control-Allow-Origin')。

而在 Chrome 中会显示如下错误:

XMLHttpRequest cannot load http://XXXX/x. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://XXX' is therefore not allowed access.

而这个问题是由于浏览器 同源策略 导致的。

让我们先了解同源策略的概念:(来自百度)
 同源策略(Same origin policy)是一种约定,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,则浏览器的正常功能可能都会受到影响。可以说Web是构建在同源策略基础之上的,浏览器只是针对同源策略的一种实现。

所谓的同源是指:域名、协议、端口相同。

ok,很明显,出现这个问题是由于域名、协议或端口不相同导致的。
从网上找了很多资料,大部分的方法都指向下面这种解决方式:

response.writeHead(200, {'Access-Control-Allow-Origin':'*'});

 这种方式也实际帮我解决了问题,但是有一个问题就是,如果项目真实上线了,我们必须对该问题进行限制,因此如果只是简单的进行该设置,会让我们的程序暴露在危险中的,以下的改进方式: 将*替换成指定的域名
 如果还是无法解决,网上还有另一种解决方式:
在被请求服务器根目录下创建: crossdomain.xml 文件。内容格式如下:

<?xml version="1.0"?>
<cross-domain-policy>
<allow-access-from domain="*" />
</cross-domain-policy>

该方法笔者没有进行验证,仅供参考。