1.什么是跨域以及產(chǎn)生原因
跨域是指a頁面想獲取b頁面資源，如果a、b頁面的協(xié)議、域名、端口、子域名不同，或是a頁面為ip地址，b頁面為域名地址，所進(jìn)行的訪問行動(dòng)都是跨域的，而瀏覽器為了安全問題一般都限制了跨域訪問，也就是不允許跨域請(qǐng)求資源。
2.跨域的常見解決方法
目前來講沒有不依靠服務(wù)器端來跨域請(qǐng)求資源的技術(shù)
1.jsonp 需要目標(biāo)服務(wù)器配合一個(gè)callback函數(shù)。
2.window.name+iframe 需要目標(biāo)服務(wù)器響應(yīng)window.name。
3.window.location.hash+iframe 同樣需要目標(biāo)服務(wù)器作處理。
4.html5的 postMessage+ifrme 這個(gè)也是需要目標(biāo)服務(wù)器或者說是目標(biāo)頁面寫一個(gè)postMessage，主要側(cè)重于前端通訊。
5.CORS 需要服務(wù)器設(shè)置header ：Access-Control-Allow-Origin。
6.Nginx反向代理 這個(gè)方法一般很少有人提及，但是他可以不用目標(biāo)服務(wù)器配合，不過需要你搭建一個(gè)中轉(zhuǎn)nginx服務(wù)器，用于轉(zhuǎn)發(fā)請(qǐng)求。
當(dāng)然，Apache 也可以做反向代理，原理差不多，見上一篇文章，此處不多說。
nginx反向代理具體配置
redis.conf文件如下：
## Basic reverse proxy server ##
## Apache backend for www.redis.com.cn ##
upstream apachephp {
server ip:8080; #Apache
}
## Start www.redis.com.cn ##
server {
listen 80;
server_name www.redis.com.cn;
access_log logs/redis.access.log main;
error_log logs/redis.error.log;
root html;
index index.html index.htm index.php;
## send request back to apache ##
location / {
proxy_pass http://apachephp;
#Proxy Settings
proxy_redirect off;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_next_upstream error timeout invalid_header http_500 http_502 http_503 http_504;
proxy_max_temp_file_size 0;
proxy_connect_timeout 90;
proxy_send_timeout 90;
proxy_read_timeout 90;
proxy_buffer_size 4k;
proxy_buffers 4 32k;
proxy_busy_buffers_size 64k;
proxy_temp_file_write_size 64k;
}
}
## End www.redis.com.cn ##
以下做一個(gè)解釋：
1.'^~ /proxy/html/ '
就像上面說的一樣是一個(gè)匹配規(guī)則，用于攔截請(qǐng)求，匹配任何以 /proxy/html/開頭的地址，匹配符合以后，停止往下搜索正則。
2.rewrite ^/proxy/html/(.*)$ /$1 break;
代表重寫攔截進(jìn)來的請(qǐng)求，并且只能對(duì)域名后邊的除去傳遞的參數(shù)外的字符串起作用，例如www.c.com/proxy/html/api/msg?method=1¶=2重寫。只對(duì)/proxy/html/api/msg重寫。
rewrite后面的參數(shù)是一個(gè)簡單的正則 ^/proxy/html/(.*)$ ,$1代表正則中的第一個(gè)(),$2代表第二個(gè)()的值,以此類推。
break代表匹配一個(gè)之后停止匹配。
3.proxy_pass
既是把請(qǐng)求代理到其他主機(jī)，其中 http://www.b.com/ 寫法和 http://www.b.com寫法的區(qū)別如下:
不帶/
location /html/
{
proxy_pass http://b.com:8300;
}
帶/
location /html/
{
proxy_pass http://b.com:8300/;
}
上面兩種配置，區(qū)別只在于proxy_pass轉(zhuǎn)發(fā)的路徑后是否帶 “/”。
針對(duì)情況1，如果訪問url = http://server/html/test.jsp，則被nginx代理后，請(qǐng)求路徑會(huì)便問http://proxy_pass/html/test.jsp，將test/ 作為根路徑，請(qǐng)求test/路徑下的資源。
針對(duì)情況2，如果訪問url = http://server/html/test.jsp，則被nginx代理后，請(qǐng)求路徑會(huì)變?yōu)?http://proxy_pass/test.jsp，直接訪問server的根資源。
修改配置后重啟nginx代理就成功了。
