為什么存在跨域
首先要知道,不管是簡單請求還是復雜請求,服務端每次都是要對跨域和資源進行判斷的(客戶端的順滑只是服務端的偽裝罷了~)。跨域只是瀏覽器的一種保護機制,是為了保護站點的安全,其實跨域本身是不存在的,為了安全瀏覽器針對XMLHTTPRequest和fetch這種腳本發起的跨域請求做了一定的跨域限制,而對于瀏覽器自身的如img的src、script的js資源、form表單的提交,沒有做跨域的限制。
- 簡單請求:這是因為img的src、script的js只能發起get請求,而表單雖然能進行post提交,但一方面表單的提交是顯式的,用戶可以感知,另一方面,表單提交只能發起請求,而不能獲取請求的響應,這樣一來,請求可以發起,而服務端可以進行拒絕,瀏覽器認為這是安全的。
- 復雜請求:通過腳本發起的跨域請求,可以對響應內容做處理,這是用戶不可感知的,瀏覽器認為這是不安全的,所以對于復雜請求,進行跨域的限制,而CORS機制就是瀏覽器對跨域進行處理。對于復雜請求會發起一個預檢請求,判斷服務端是否可以接受這個跨域請求,接受后就可以向服務端發起真正的請求。
為什么要區分簡單和非簡單請求
1、因為瀏覽器認為簡單請求是安全的,所以可以通過跨域限制到達服務器,也就沒必要對簡單請求做預檢請求(人家本來就可以通過跨域你預檢個什么)
2、當然簡單請求也進行預檢,不過沒必要,因為預檢請求是干嘛的呢你要知道。
為什么要發起預檢請求
瀏覽器進行跨域限制主要是通過兩種方式
- 限制跨域請求的發出
- 請求可以發出,但是響應結果會被攔截
而瀏覽器免不了要進行跨域,訪問資源哪有不跨域的,不跨域你只能看自己域里面的東西,所以瀏覽器一般是采用第二個攔截方式,而這種攔截方式,可能已經對服務端進行了數據的操作,為了防止這種情況,首先發起預檢請求,來檢測是否能夠發起真正的請求。(這里能知道,簡單請求是沒必要進行預檢的,因為瀏覽器認為,簡單請求是安全的,是被用戶允許的)
預檢請求預檢的是url 所以即使是同源的 每個復雜請求都會進行預檢 主要是對比url和方法
cors請求過程
首先如果是簡單請求則在請求頭直接添加orgin字段,對于非簡單請求需要一次預檢請求options,需要origin字段,當服務端通過預檢請求會在響應頭攜帶Allow-controll-Access-Origin字段(為*或者是origin的值),之后的請求就像簡單請求一樣,攜帶origin字段。
請求頭響應頭過程:http://www.lxweimin.com/p/b6520a7fb386