4.6 CORS支持

CORS（Cross-Origin Resource Sharing）是由W3C制定的一種跨域資源共享技術標準，其目的就是為了解決前端的跨域請求。在Java EE開發中，最常見的前端跨域請求解決方案是JSONP，但是JSONP只支持GET請求，這是一個很大的缺陷，而CORS則支持多種HTTP請求方法。以CORS中的GET請求為例，當瀏覽器發起請求時，請求頭中攜帶了如下信息：

假如服務端支持CORS，則服務端給出的響應信息如下：

以DELETE請求為例，當前端發起一個DELETE請求時，這個請求的處理會經過兩個步驟。

第一步：發送一個OPTIONS請求。代碼如下：

這個請求將向服務端詢問是否具備該資源的DELETE權限，服務端會給瀏覽器一個響應，代碼如下：

服務端給瀏覽器的響應，Allow頭信息表示服務端支持的請求方法，這個請求相當于一個探測請求，當瀏覽器分析了請求頭字段之后，知道服務端支持本次請求，則進入第二步。

第二步：發送DELETE請求。接下來瀏覽器就會發送一個跨域的DELETE請求，代碼如下：

服務端給一個響應：

至此，一個跨域的DELETE請求完成。

無論是簡單請求還是需要先進行探測的請求，前端的寫法都是不變的，額外的處理都是在服務端來完成的。在傳統的Java EE開發中，可以通過過濾器統一配置，而Spring Boot中對此則提供了更加簡潔的解決方案。在Spring Boot中配置CORS的步驟如下：

1. 創建Spring Boot工程

首先創建一個Spring Boot工程，添加Web依賴，代碼如下：

2. 創建控制器

在新創建的Spring Boot工程中，添加一個BookController控制器，代碼如下：

BookController中提供了兩個接口：一個是添加接口，另一個是刪除接口。

3. 配置跨域

跨域有兩個地方可以配置。一個是直接在相應的請求方法上加注解：

代碼解釋：

? @CrossOrigin中的value表示支持的域，這里表示來自http://localhost:8081域的請求是支持跨域的。

? maxAge表示探測請求的有效期，在前面的講解中，讀者已經了解到對于DELETE、PUT請求或者有自定義頭信息的請求，在執行過程中會先發送探測請求，探測請求不用每次都發送，可以配置一個有效期，有效期過了之后才會發送探測請求。這個屬性默認是1800秒，即30分鐘。

? allowedHeaders表示允許的請求頭，*表示所有的請求頭都被允許。

這種配置方式是一種細粒度的配置，可以控制到每一個方法上。當然，也可以不在每個方法上添加@CrossOrigin注解，而是采用一種全局配置，代碼如下：

代碼解釋：

? 全局配置需要自定義類實現WebMvcConfigurer接口，然后實現接口中的addCorsMappings方法。

? 在addCorsMappings方法中，addMapping表示對哪種格式的請求路徑進行跨域處理；allowedHeaders表示允許的請求頭，默認允許所有的請求頭信息；allowedMethods表示允許的請求方法，默認是GET、POST和HEAD；*表示支持所有的請求方法；maxAge表示探測請求的有效期；allowedOrigins表示支持的域。

在上面的兩種配置方式（@CrossOrigin注解配置和全局配置）中，選擇其中一種即可，然后啟動項目。

4. 測試

新建一個Spring Boot項目，添加Web依賴，然后在resources/static目錄下加入jquery.js，再在resources/static目錄下創建一個index.html文件，內容如下：

兩個普通的Ajax都發送了一個跨域請求。

然后將項目的端口修改為8081，代碼如下：

啟動項目，在瀏覽器中輸入“http://localhost:8081/index.html”，查看頁面，然后分別單擊兩個按鈕，查看請求結果，如圖4-24所示。