Nginx允许跨域访问的配置问题

如今前后端分离的模式,越来越成为很多团队的选择,通过分离前后端的工作,是的双方更能关注于自己核心的工作领域,只需要通过相应的API接口进行交互。


前后端工作的分离带来的一个问题就是前后端在部署上分离的可能性,在部署上的分离又会触发浏览器安全机制——同源策略,从而导致不能访问非同域的资源。同样要解决跨域访问的问题,网上的解决方案也有很多,就是在跨域资源的响应中,加上允许跨域访问头信息即可。


添加头信息有几种方式:1.  直接修改代码,在HTTP响应中添加上对应的头信息;2. 使用代理服务器,在代理服务器返回响应的时候,再添加响应的头信息。


我们这里选择的是第2种方式——使用Nginx作为反向代理服务器。在使用Nginx作为代理服务器,并在配置中对应的location下添加上如下的设置:

        add_header 'Access-Control-Allow-Origin' '*';
        add_header 'Access-Control-Allow-Credentials' 'true';

通过这两个配置,前端就可以跨域访问数据接口了。但是在后续的使用过程中遇到一个问题,就是简单的GET请求都是可以跨域访问到数据的,但是POST请求的时候浏览器依然报错说跨域访问被禁止。后来发现,是因为在POST请求时,处理数据过程中发生了异常,导致了浏览器报跨域访问错误。但为什么会这样呢?


经查,这是因为Nginx的add_header指令并不能在HTTP返回码为50X的时候起作用,由于服务器处理逻辑出错,导致了Nginx返回内部服务器错误(500),这个时候add_header是没有起作用的,故会出现这样的问题。


大家可以参考这个Nginx文档:http://nginx.org/en/docs/http/ngx_http_headers_module.html

  • 5
    点赞
  • 10
    收藏
    觉得还不错? 一键收藏
  • 2
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值