当前位置：首页 > 资讯 > 技术文档

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

时间：2021-02-08 19:36 编辑：来源：阅读：
扫一扫，手机访问

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

[b]一、什么是跨域问题[/b] 在一个服务器A里放置了json文件，另一个服务器B想向A发送ajax请求，获取此文件，会发生错误。 [b]Chrome提示：[/b]

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

这就是跨域问题。解决方案有不少，比较好的是服务器端配置CORS，但要求服务器端做更改。如果在不需要更改服务器端的情况下解决呢？尤其是需要在本地测试的时候。 [b]二、配置Nginx[/b] 打开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/域名。 [b]例如，请求：[/b] 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也可以正常工作。 [b]注意：[/b] /api/ 不行写成 /api。 http://www.des.com/ 也不能写成 http://www.des.com [b]三、配置hosts[/b] 为了在本机测试看起来更像在目标服务器上测试，可以设置系统的hosts文件。每个系统（windows、Linux、Mac OS）都有hosts文件，它是本地的域名解析器。通常，我们请求一个域名，如www.baidu.com，首先要向域名服务器请求百度的IP地址，然后再根据IP地址来访问。也可以不需要咨询域名服务器，直接在本地的hosts键入百度的IP地址。 [b]例如 [/b] 252.192.0.15 www.baidu.com 这样，系统会先从hosts文件里搜索IP地址。 Windows下的hosts文件位于：C:\Windows\System32\drivers\etc [b]打开后，添加[/b]

127.0.0.1 www.des.com

则，每次访问www.des.com，就会链接到本地。 [b]总结[/b] 以上就是这篇文章的全部内容了，希望本文的内容对大家的学习或者工作能带来一定的帮助，如果有疑问大家可以留言交流。

全部评论(0)

上一篇：Nginx跨域使用字体文件的配置方法
下一篇：php微信支付接口开发程序

资讯排行榜
更多>>