解決 js ajax跨域訪問報“No 'Access-Control-Allow-Origin' header is present on the requested resource.”錯誤

在本地用ajax跨域訪問請求時報錯:

 

XMLHttpRequest cannot loadhttp://www.zjblogs.com/. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access.

 

查了一翻資料,發現原來是新W3C標準中是這樣規定的:

 

最新的W3C標準裏是這麼實現HTTP跨域請求的, Cross-Origin Resource Sharing
 

簡單的來說,就是跨域的目標服務器要返回一系列的Headers,通過這些Headers來控制是否同意跨域。這些Headers有:4 Syntax

 

 

 

在 Request 包和 Response 包中都有一些。

其中最敏感的就是 Access-Control-Allow-Origin 這個 Header, 他是W3C標準裏用來檢查該跨域請求是否可以被通過。 (Access Control Check)

跨域實現的過程大致如下:

從 http://www.a.com/test.html 發起一個跨域請求,

請求的地址爲: http://www.b.com/test.PHP

如果 服務器B返回一個如下的header

Access-Control-Allow-Origin: http://www.a.com

那麼,這個來自 http://www.a.com/test.html 的跨域請求就會被通過。

 

如上所知,總結解決辦法如下:

 

1、如果請求的url是aspx頁面,則需要在aspx頁面中添加代碼:Response.AddHeader("Access-Control-Allow-Origin", "*");

 

2、如果請求的url是PHP頁面,則需要在PHP頁面中添加代碼:header("Access-Control-Allow-Origin: *");

 

3、如果請求的url是靜態的html頁面,則需要在頁面中添加meta標籤代碼:<meta http-equiv="Access-Control-Allow-Origin" content="*" />

 

如果服務器端可以確定是要被哪些域名訪問,最好是能把以上代碼中的“*”代替爲具體的域名,這樣做可以相應的增強安全性。

 

 

如果還不行,就把這些都加上吧

 

  1. // 指定允許其他域名訪問    
  2. header('Access-Control-Allow-Origin:*');    
  3. // 響應類型    
  4. header('Access-Control-Allow-Methods:POST');    
  5. // 響應頭設置    
  6. header('Access-Control-Allow-Headers:x-requested-with,content-type');  

 

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章