一、什么是跨域問題

在一個服務(wù)器A里放置了json文件，另一個服務(wù)器B想向A發(fā)送ajax請求，獲取此文件，會發(fā)生錯誤。

Chrome提示：

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

這就是跨域問題。解決方案有不少，比較好的是服務(wù)器端配置CORS，但要求服務(wù)器端做更改。如果在不需要更改服務(wù)器端的情況下解決呢？尤其是需要在本地測試的時候。

二、配置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.tjdsmy.cn/; # [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/表示當(dāng)請求api目錄時，轉(zhuǎn)向http://www.tjdsmy.cn/域名。 

例如，請求：

http://www.tjdsmy.cn/api/ 就會轉(zhuǎn)向 http://www.tjdsmy.cn/

http://www.tjdsmy.cn/api/aaa/bbb/ 就會轉(zhuǎn)向 http://www.tjdsmy.cn/aaa/bbb/

這種由服務(wù)器轉(zhuǎn)發(fā)的請求，可以突破跨域的限制，因此ajax也可以正常工作。

注意： /api/ 不行寫成 /api。

http://www.tjdsmy.cn/ 也不能寫成 http://www.tjdsmy.cn

三、配置hosts

為了在本機測試看起來更像在目標(biāo)服務(wù)器上測試，可以設(shè)置系統(tǒng)的hosts文件。 

每個系統(tǒng)（windows、Linux、Mac OS）都有hosts文件，它是本地的域名解析器。 

通常，我們請求一個域名，如www.tjdsmy.cn，首先要向域名服務(wù)器請求百度的IP地址，然后再根據(jù)IP地址來訪問。

也可以不需要咨詢域名服務(wù)器，直接在本地的hosts鍵入百度的IP地址。

例如 

252.192.0.15 www.tjdsmy.cn

這樣，系統(tǒng)會先從hosts文件里搜索IP地址。

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

打開后，添加

127.0.0.1 www.tjdsmy.cn

則，每次訪問www.tjdsmy.cn，就會鏈接到本地。