Nginx解决转发地址时跨域的问题

 更新时间:2017年01月16日 10:25:09   作者:DecemberCafe  
这篇文章主要介绍了Nginx实现转发地址解决跨域问题的方法,文中介绍的很详细,对大家的学习具有一定的参考借鉴价值,有需要的朋友可以参考借鉴,下面来一起看看吧。

一、什么是跨域问题

在一个服务器A里放置了json文件,另一个服务器B想向A发送ajax请求,获取此文件,会发生错误。

Chrome提示:

XMLHttpRequest cannot load ******. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access.

这就是跨域问题。解决方案有不少,比较好的是服务器端配置CORS,但要求服务器端做更改。如果在不需要更改服务器端的情况下解决呢?尤其是需要在本地测试的时候。

二、配置Nginx

打开nginx目录下的conf文件夹。打开nginx.conf,将其中的http请求修改为:

http {
  include mime.types;
  server {
    listen    80;
    server_name localhost;
    charset UTF-8;

  location / {
    root html;
    index index.html index.htm;
  }

    # Avoid CORS and reverse proxy settings
    location /api/ { # [2]
      proxy_http_version 1.1;
      proxy_pass http://www.des.com/; # [3]

      add_header Access-Control-Allow-Origin *;
      add_header Access-Control-Allow-Methods "POST, GET, OPTIONS";
      add_header Access-Control-Allow-Headers "Origin, Authorization, Accept";
      add_header Access-Control-Allow-Credentials true;
    }
  }
}

注意粗体字的部分,/api/表示当请求api目录时,转向http://www.des.com/域名。

例如,请求:

http://127.0.0.1/api/ 就会转向 http://www.des.com/

http://127.0.0.1/api/aaa/bbb/ 就会转向 http://www.des.com/aaa/bbb/

这种由服务器转发的请求,可以突破跨域的限制,因此ajax也可以正常工作。

注意: /api/ 不行写成 /api。

http://www.des.com/ 也不能写成 http://www.des.com

三、配置hosts

为了在本机测试看起来更像在目标服务器上测试,可以设置系统的hosts文件。

每个系统(windows、Linux、Mac OS)都有hosts文件,它是本地的域名解析器。

通常,我们请求一个域名,如www.baidu.com,首先要向域名服务器请求百度的IP地址,然后再根据IP地址来访问。

也可以不需要咨询域名服务器,直接在本地的hosts键入百度的IP地址。

例如

252.192.0.15 www.baidu.com

这样,系统会先从hosts文件里搜索IP地址。

Windows下的hosts文件位于:C:\Windows\System32\drivers\etc

打开后,添加

127.0.0.1 www.des.com

则,每次访问www.des.com,就会链接到本地。

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流。

相关文章

  • nginx配置ssl证书实现https访问的示例

    nginx配置ssl证书实现https访问的示例

    这篇文章主要介绍了nginx配置ssl证书实现https访问的示例,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-03-03
  • Nginx解决转发地址时跨域的问题

    Nginx解决转发地址时跨域的问题

    这篇文章主要介绍了Nginx实现转发地址解决跨域问题的方法,文中介绍的很详细,对大家的学习具有一定的参考借鉴价值,有需要的朋友可以参考借鉴,下面来一起看看吧。
    2017-01-01
  • Windows系统下Nginx服务器的基本安装和配置方法介绍

    Windows系统下Nginx服务器的基本安装和配置方法介绍

    这篇文章主要介绍了Windows系统下Nginx服务器的基本安装和配置方法,文中给出了一个配置文件的实例并作出了些说明,需要的朋友可以参考下
    2015-12-12
  • WebApi部署多服务器配置Nginx负载均衡的教程

    WebApi部署多服务器配置Nginx负载均衡的教程

    这篇文章主要介绍了WebApi部署多服务器配置Nginx负载均衡 ,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2020-03-03
  • Nginx解决403 forbidden的完整步骤

    Nginx解决403 forbidden的完整步骤

    这篇文章主要给大家介绍了关于Nginx解决403 forbidden的完整步骤,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-09-09
  • 在CentOS 7上进行 Nginx安装教程

    在CentOS 7上进行 Nginx安装教程

    这篇文章主要介绍了在CentOS 7上进行 Nginx安装教程,非常不错,具有参考借鉴价值,需要的朋友可以参考下
    2016-12-12
  • Nginx 配置根据请求IP末段进行分流的方法

    Nginx 配置根据请求IP末段进行分流的方法

    这篇文章主要介绍了Nginx 配置根据请求IP末段进行分流的方法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-07-07
  • Nginx中404页面的配置及AJAX请求返回404页面的方法

    Nginx中404页面的配置及AJAX请求返回404页面的方法

    404是请求页面不存在的错误代码,在Nginx中有时处理jQuery中的ajax方法虽然能返回404页面但错误代码却返回200,针对此问题我们具体来看一下Nginx中404页面的配置及AJAX请求返回404页面的方法
    2016-05-05
  • CentOS 7.0下nginx实现每天定时分割日志

    CentOS 7.0下nginx实现每天定时分割日志

    大家都知道Nginx产生的日志都是存在一个文件,随着网站运行时间越长,日志文件的大小也在不断增长,所以这个时候就需要实现定时分割,这篇文章主要介绍了在CentOS 7.0下nginx实现每天定时分割日志的相关资料,需要的朋友可以参考下。
    2017-04-04
  • 浅谈nginx反向代理中神奇的斜线

    浅谈nginx反向代理中神奇的斜线

    这篇文章主要介绍了浅谈nginx反向代理中神奇的斜线,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-09-09

最新评论