1.什么是跨域以及產生原因
跨域是指a頁面想獲取b頁面資源,如果a、b頁面的協議、域名、端口、子域名不同,或是a頁面為ip地址,b頁面為域名地址,所進行的訪問行動都是跨域的,而瀏覽器為了安全問題一般都限制了跨域訪問,也就是不允許跨域請求資源。
2.跨域的常見解決方法
目前來講沒有不依靠服務器端來跨域請求資源的技術
1.jsonp 需要目標服務器配合一個callback函數。
2.window.name+iframe 需要目標服務器響應window.name。
3.window.location.hash+iframe 同樣需要目標服務器作處理。
4.html5的 postMessage+ifrme 這個也是需要目標服務器或者說是目標頁面寫一個postMessage,主要側重于前端通訊。
5.CORS 需要服務器設置header :Access-Control-Allow-Origin。
6.Nginx反向代理 這個方法一般很少有人提及,但是他可以不用目標服務器配合,不過需要你搭建一個中轉nginx服務器,用于轉發請求。
當然,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 ##
以下做一個解釋:
1.'^~ /proxy/html/ '
就像上面說的一樣是一個匹配規則,用于攔截請求,匹配任何以 /proxy/html/開頭的地址,匹配符合以后,停止往下搜索正則。
2.rewrite ^/proxy/html/(.*)$ /$1 break;
代表重寫攔截進來的請求,并且只能對域名后邊的除去傳遞的參數外的字符串起作用,例如www.c.com/proxy/html/api/msg?method=1¶=2重寫。只對/proxy/html/api/msg重寫。
rewrite后面的參數是一個簡單的正則 ^/proxy/html/(.*)$ ,$1代表正則中的第一個(),$2代表第二個()的值,以此類推。
break代表匹配一個之后停止匹配。
3.proxy_pass
既是把請求代理到其他主機,其中 http://www.b.com/ 寫法和 http://www.b.com寫法的區別如下:
不帶/
location /html/
{
proxy_pass http://b.com:8300;
}
帶/
location /html/
{
proxy_pass http://b.com:8300/;
}
上面兩種配置,區別只在于proxy_pass轉發的路徑后是否帶 “/”。
針對情況1,如果訪問url = http://server/html/test.jsp,則被nginx代理后,請求路徑會便問http://proxy_pass/html/test.jsp,將test/ 作為根路徑,請求test/路徑下的資源。
針對情況2,如果訪問url = http://server/html/test.jsp,則被nginx代理后,請求路徑會變為 http://proxy_pass/test.jsp,直接訪問server的根資源。
修改配置后重啟nginx代理就成功了。