ajax跨域問(wèn)題龟劲，是每一個(gè)web前端都會(huì)經(jīng)常遇到的問(wèn)題观话，當(dāng)然解決前端跨域的方法也有很多方法予借，這里我只記錄一下如何使用nginx反向代理來(lái)實(shí)現(xiàn)跨域請(qǐng)求。
那么什么是正向代理频蛔，什么又是反向代理呢灵迫？如果你還不清楚這些概念，請(qǐng)看這篇文章http://blog.csdn.net/m13666368773/article/details/8060481
如果出現(xiàn)跨域就是下面這樣晦溪，很心塞瀑粥！image.png
下面我們就進(jìn)入正題，看看如何利用nginx反向代理三圆，解決前端跨域問(wèn)題
我下載的版本是nginx / Windows-1.12.1狞换，安裝就不多說(shuō)了很簡(jiǎn)單，下面是我安裝之后的截圖1.下載nginx并安裝
下載地址：http://nginx.org/en/download.html
image.png
2.修改配置文件 conf/nginx.conf
下面是我的配置截圖和代碼
image.png
server {
listen 8000; #默認(rèn)監(jiān)聽(tīng)80端口舟肉，我這里改成8000
server_name localhost; #當(dāng)前服務(wù)域名修噪，一般都是開(kāi)發(fā)者本地電腦
#charset koi8-r;
#access_log logs/host.access.log main;
location / {
root D:\WWW\Work; #默認(rèn)為nginx安裝目錄下的html文件夾，我這里修改配置路徑
index index.html index.htm;
}
location /apis { #配置一個(gè)/apis 重寫(xiě)到我們真正的api地址http://xxx.xx.xx.xx:xxxx/;
rewrite ^.+apis/?(.*)$ /$1 break;
include uwsgi_params;
#真實(shí)api服務(wù)器地址
proxy_pass http://xxx.xx.xx.xx:xxxx/;
}
后面的代碼就省略了 .......
}
3.修改js文件的ajax請(qǐng)求代碼
修改之前度气，我們的請(qǐng)求地址是這樣的http://120.xx.xx.xx:xxxx/app/api/memberInfo
image.png
使用反向代理后應(yīng)該改成這樣/apis/app/api/memberInfo
image.png
至此我們的反向代理就ok了割按，地址欄輸入localhost:8000/xx/xx.html（端口號(hào)改成自己配置的）應(yīng)該就可以正常獲取到我們真正api服務(wù)器上的數(shù)據(jù)了
注意點(diǎn)：
1.先關(guān)閉防火墻
2.默認(rèn)端口號(hào)很可能被占用膨报，要配置一個(gè)沒(méi)有被占用端口
3.js文件中的ajax請(qǐng)求地址記得修改
4.每次修改了nginx的配置文件都要重新啟動(dòng)nginx
