跨域解決方案之CORS

目錄

1.什麼叫做跨域請求

2.跨域呼叫測試

3.解決方案cors跨域

（1）概述

（2）請求過程

（3）解決辦法

（4）springmvc跨域註解

跨域是指通過js在不同的域之間進行資料傳輸或通訊，比如用ajax向乙個不同的域請求資料，或者通過js獲取頁面中不同域的框架中(iframe)的資料。只要協議、網域名稱、埠有任何乙個不同，都被當作是不同的域。

（1）啟動乙個服務,埠號為8080

@restcontroller

public class corscontroller 
}

test.html

​

$scope.findname=function () )}
})}}

failed to load http://localhost:8080/findname.do: no 'access-control-allow-origin' header is present on the requested resource. origin 'http://localhost:9090' is therefore not allowed access. the response had http status code 404.

它允許瀏覽器向跨源伺服器，發出xmlhttprequest請求，從而克服了ajax只能同源使用的限制。整個cors通訊過程，都是瀏覽器自動完成，不需要使用者參與。對於開發者來說，cors通訊與同源的ajax通訊沒有差別，**完全一樣。瀏覽器一旦發現ajax請求跨源，就會自動新增一些附加的頭資訊，有時還會多出一次附加的請求，但使用者不會有感覺。因此，實現cors通訊的關鍵是伺服器。只要伺服器實現了cors介面，就可以跨源通訊。

請求過程如下圖:

然後伺服器端給我們返回乙個preflight response

access-control-allow-origin是html5中定義的一種解決資源跨域的策略。

他是通過伺服器端返回帶有access-control-allow-origin標識的response header，用來解決資源的跨域許可權問題。

使用方法，在response新增 access-control-allow-origin，例如

access-control-allow-origin:www.google.com

更改8080埠的controller方法

@restcontroller

public class corscontroller 
}

如果要操作cookie，後端controller層加如下**

//此時access-control-allow-origin無法用*匹配任意位址，必須指定精確的路徑

response.setheader("access-control-allow-credentials", "true");

前端必須在ajax請求中開啟withcredentials屬性

$http.get('http://localhost:8080/cors01/findname.do',)

響應頭如下：

springmvc的版本在4.2或以上版本，可以使用註解實現跨域, 我們只需要在需要跨域的方法上新增註解@crossorigin即可

@crossorigin(origins="http://localhost:9090",allowcredentials="true")

跨域解決方案之CORS

一般在前後端分離專案中,前端請求介面,瀏覽器控制台報如下錯誤 類似 no access control allow origin header 報錯 跨域請求產生的原因是 瀏覽器的同源策略 這是乙個用於隔離潛在惡意檔案的重要安全機制.一旦請求的資源不是同源那麼即是跨域 判斷是否是跨域,本質是判斷是否...

CORS跨域解決方案

這裡說的js跨域是指通過js在不同的域之間進行資料傳輸或通訊，比如用ajax向乙個不同的域請求資料，或者通過js獲取頁面中不同域的框架中 iframe 的資料。只要協議 網域名稱 埠有任何乙個不同，都被當作是不同的域。cors允許瀏覽器向跨源伺服器，發出xmlhttprequest請求，從而克服了a...

跨域解決方案CORS

cors 需要瀏覽器和後端同時支援。ie 8 和 9 需要通過 xdomainrequest 來實現。瀏覽器會自動進行 cors 通訊，實現 cors 通訊的關鍵是後端。只要後端實現了 cors，就實現了跨域。服務端設定 access control allow origin 就可以開啟 cors。...