当前位置:C++技术网 > 资讯 > 使用Nginx反向代理解决浏览器跨域问题

使用Nginx反向代理解决浏览器跨域问题

更新时间:2018-01-07 13:46:10浏览次数:1+次

        在需求不断的变化,不断的增多的前提下,开发的系统也越来越多,一个域名已经不能满足要求了。所以我们会开更多的域名来支持不同的业务,这样很清晰。然而,域名变多后,不同系统之间调用API时,浏览器会有跨域问题。

        之前的处理逻辑是,在服务器加跨域头说明,这样就可以支持跨域了。我们新系统都这么干的,工作的挺好的。另一种方式就是jsonp方式,我不喜欢这种方式。

        不过在老系统里的接口,想在新系统里去调用,如何不改变老系统的接口,而且能够避免跨域问题呢?这是一个很好的问题,而且是一个非常实在的问题。我们难道要一个个的去改老系统的接口,然后支持跨域?对于成百上千的API,是不是有种想死的冲动呢?!

        不过,我们既然有新系统,自然有新域名,有新服务器,我们就要好好利用起来。我们仔细研究一下跨域问题的原理,再攻破之!

        跨域问题,是浏览器为了安全起见,对网页内请求其他域名时做的一种限定,以免在A域名下,有脚本偷偷下载B域名的木马什么的。如果A域名自己下载木马,那就是另外一回事了。在本站下载木马,浏览器会拦截为危险网站。而在A域名下偷偷下载B域名的木马,很可能是被注入了代码。浏览器的跨域阻止功能,就可以防止这一点。

        那么如果是我们正常的调用,一样被跨域阻止了。解决的办法当然也是有的。

    1.让浏览器支持跨域。

         其实浏览器本来就支持,我们可以关闭跨域阻止功能即可。至于各个浏览器如何设置,大家可以网上查资料,很多。

    2.让服务器支持跨域,增加跨域说明。

        当我们在服务器设置了跨域说明,浏览器也是可以放行的。在web.py中,我们可以这样设置跨域:

web.header('Access-Control-Allow-Origin', "*")
    这里可以设置更详细的跨域支持设置,就不细讲,想要了解,就查一下资料吧。

    3.反向代理支持跨域,解决老系统不支持跨域问题。

        因为跨域是浏览器造成的。如果我们使用服务器来请求老系统,而前端页面放在新系统,调用新系统的接口,然后服务器将新系统的接口代理到老系统对应的接口,这样就不存在跨域问题了。

        那么问题是,我们如何去设置?我们只要设置好反向代理支持就行了,我们就拿nginx来配置吧。配置代码如下:

location /user/ {
    proxy_pass https://www.cjjjs.com;
    proxy_set_header Host      $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_redirect http:// $scheme://; #做https跳转
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}
    这样就可以将当前域名下请求/user/下的地址反向代理到https://www.cjjjs.com。其他的参数什么的都保持原样的转发了。这样一来,老系统就不需要做任何处理,就可以支持新系统调用接口了。