ajax跨域問題

跨域請求ajax,在正式發出請求前會自動發送一個preflight request請求,這個請求方式是options,不帶cookie和參數,拿到服務器返回如果Access-Control-Allow-Origi允許當前域名跨域訪問,那么隨后會正式發送你的ajax請求。如果不允許就會報錯。
要注意preflight request請求的地址和正常請求地址是一樣的,注意沒有cookie和參數,后臺業務邏輯要注意NPE問題。

HTTP請求頭參考http://www.lxweimin.com/p/d05303d34222

#請求域
Origin: ”http://localhost:3000“

#這兩個屬性只出現在預檢請求中,即OPTIONS請求
Access-Control-Request-Method: ”POST“
Access-Control-Request-Headers: ”content-type“

HTTP響應頭,參考http://www.lxweimin.com/p/d05303d34222

#允許向該服務器提交請求的URI,*表示全部允許,在SpringMVC中,如果設成*,會自動轉成當前請求頭中的Origin
Access-Control-Allow-Origin: ”http://localhost:3000“

#允許訪問的頭信息
Access-Control-Expose-Headers: "Set-Cookie"

#預檢請求的緩存時間(秒),即在這個時間段里,對于相同的跨域請求不會再預檢了
Access-Control-Max-Age: ”1800”

#允許Cookie跨域,在做登錄校驗的時候有用
Access-Control-Allow-Credentials: “true”

#允許提交請求的方法,*表示全部允許
Access-Control-Allow-Methods:GET,POST,PUT,DELETE,PATCH

下面是一個在百度網頁中跨域請求另一個網站的network信息:

Request URL:http://bike-api.jdd.com/bike/api/game/status.do
Request Method:OPTIONS
Status Code:200 OK
Remote Address:192.168.137.142:80
Referrer Policy:unsafe-url

Response Headers
view source
Access-Control-Allow-Credentials:true
Access-Control-Allow-Headers:device
Access-Control-Allow-Methods:POST
Access-Control-Allow-Origin:http://www.baidu.com
Access-Control-Max-Age:1800
Allow:GET, HEAD, POST, PUT, DELETE, TRACE, OPTIONS, PATCH
Connection:keep-alive
Content-Length:0
Date:Tue, 02 Jan 2018 11:25:57 GMT
Server:nginx
Vary:Origin

Request Headers
view source
Accept:*/*
Accept-Encoding:gzip, deflate, sdch
Accept-Language:zh-CN,zh;q=0.8,en;q=0.6
Access-Control-Request-Headers:device
Access-Control-Request-Method:POST
Connection:keep-alive
Host:bike-api.jdd.com
Origin:http://www.baidu.com
Referer:http://www.baidu.com/
User-Agent:Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/57.0.2987.110 Safari/537.36

編寫CORS可以用CorsFilter,CorsInterceptor和@CorsOrigin(在Controller上加)3種方法。
CorsFilter可以對全部url起作用,interceptor只攔截springmvc請求,@corsorigin只對某個Controller起作用。
任務:pre-flight request會經過interceptor,不知到會不會進入controller執行業務邏輯???
理想情況下,pre-flight request應該在CorsFilter或者CorsInterceptor直接返回,不應該進入用戶的filter,interceptor和controller.

?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容