nginx配置跨域問題

1.跨域指的是瀏覽器不能執行其它網站的腳本,它是由瀏覽器的同源策略形成的,是瀏覽器對JavaScript 施加的安全限制。html

2.瀏覽器在執行腳本的時候,都會檢查這個腳本屬於哪一個頁面,即檢查是否同源,只有同源的腳本纔會被執行;而非同源的腳本在請求數據的時候,瀏覽器會報一個異常,提示拒絕訪問。nginx

  ①、http://www.123.com/index.html 調用  http://www.123.com/welcome.jsp      協議、域名、端口號都相同,同源。web

  ②、https://www.123.com/index.html 調用 http://www.123.com/welcome.jsp      協議不一樣,非同源。跨域

  ③、http://www.123.com:8080/index.html 調用 http://www.123.com:8081/welcome.jsp   端口不一樣,非同源。瀏覽器

  ④、http://www.123.com/index.html 調用  http://www.456.com/welcome.jsp       域名不一樣,非同源。安全

  ⑤、http://localhost:8080/index.html 調用 http://127.0.0.1:8080/welcom.jsp        雖然localhost等同於 127.0.0.1 可是也是非同源的。jsp

  同源策略限制的狀況:網站

  一、Cookie、LocalStorage 和 IndexDB 沒法讀取spa

  二、DOM 和 Js對象沒法得到code

  三、AJAX 請求不能發送

  注意:對於像 img、iframe、script 等標籤的 src 屬性是特例,它們是能夠訪問非同源網站的資源的。

3.解決跨域問題的nginx配置

#設置須要跨域的指定文件
location ^~/res/ {
    add_header Access-Control-Allow-Origin *;
    add_header Access-Control-Allow-Methods 'GET,POST';
    add_header Access-Control-Allow-Headers 'DNT,X-Mx-ReqToken,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Authorization';
    alias /data/web/res/;
}    
#設置容許全局跨域
server {
   .... add_header Access
-Control-Allow-Origin *; add_header Access-Control-Allow-Methods 'GET,POST'; add_header Access-Control-Allow-Headers 'DNT,X-Mx-ReqToken,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Authorization'; }
相關文章
相關標籤/搜索