跨域問題的解決辦法針對伺服器

見名知義，跨域就是在乙個域下去請求別的域下的資源。那麼為什麼兩個不同域之間訪問就有問題呢？因為瀏覽器的同源策略。

同源策略：同源策略就像乙個規定一樣，所有支援js的瀏覽器都會使用這個策略，同源指的是那些要相同呢？網域名稱，協議，埠相同就是同源，所以說即使是localhost去訪問127.0.0.1也是跨域。如果js去請求不同域的資源，瀏覽器會報錯，不允許js去訪問，有了同源策略，web才變得更加安全。

頭一次遇到跨域問題時，我首先想到的就是**伺服器ngnix,原理很簡單，前端該怎麼請求就怎麼請求，通過****到想要請求的伺服器上不就行了。

但是這種適合比較通用的，不然每次新增乙個新的都要配置重啟nginx不是很好。

server    
}

跨域問題的出現困擾了大批敲鍵盤的，於是web的老大哥w3c提出了跨源資源共享，即cors，主要通過伺服器來實現跨域問題。其實cors的原理很簡單，通過新增特定引數來判斷是否允許跨域，什麼引數呢？首先瀏覽器傳送請求時，會判斷是不是跨域請求，如果是那麼會在請求頭新增origin引數，引數值就是傳送請求的域，伺服器收到請求後，一看是跨域請求，並且含有該引數便允許該請求的訪問，並且伺服器會在響應頭新增access-control-allow-origin欄位，字段值為伺服器規定的可以被訪問的域，瀏覽器收到伺服器的響應後，一看哦，我在伺服器規定的域裡邊，那我就把伺服器給我的返回給敲鍵盤的吧，這時我們才看到伺服器返回的資料。

request heades:

accept: */*
accept-encoding: gzip, deflate, br
accept-language: zh-cn,zh;q=0.9
connection: keep-alive
content-length: 72409
content-type: multipart/form-data; boundary=----webkitformboundarylk2lz1ybjysfciwi
host: 127.0.0.1:10011
origin: 
referer: /material/updatepicture/index.do

response headers:

access-control-allow-credentials: true access-control-allow-origin: server: jetty(9.1.0.m0) transfer-encoding: chunked

vary: origin

搞明白原理，在細說一下請求，cros將前端的請求分為簡單請求和複雜請求，

簡單請求：

不滿足簡單請求的就是複雜請求(說了好像沒說一樣)，不過對於複雜請求，瀏覽器在傳送請求之前會先傳送乙個option預檢請求，預檢請求跟正常請求沒有什麼差別，不會攜帶正常請求的資料，那麼為什麼瀏覽器會有這個操作呢？就拿跨域來說，假如沒有預檢請求，乙個跨域請求來了，並且伺服器也正常跑了自己的**，然後這時資料庫相關的資料更新了，伺服器返回響應結果，這時還沒問題，此時瀏覽器收到伺服器的響應，一看跨域了，那可不行，我得告訴敲鍵盤的你跨域了，返回個錯誤碼，我們一看，報錯了，趕緊找原因，但此時我們卻不知道資料庫已經正確更新資料了，這就很為難了，一次錯誤請求卻跑出來了正確的資料，所以這時瀏覽器如果先傳送個預檢請求，預檢請求不會攜帶真實資料，如果預檢請求成功請求了，此時傳送真實請求就不會有上邊的問題了。預檢請求除了會新增跨域的標識字段（access-control-allow-origin）外還會新增access-control-allow-methods欄位，告訴伺服器我成功請求後真實請求是什麼方式的，伺服器同樣會在響應頭中新增access-control-allow-methods，表示那些方法可以來訪問我以及access-control-max-age，單位是秒，告訴瀏覽器，我很忙，在這段時間內直接傳送真實請求就行了。有了cors，跨域就很好解決了，原理就是伺服器只需在跨域請求新增瀏覽器需要的引數就行了。

response headers:

access-control-allow-credentials: true access-control-allow-methods: get,head,post access-control-allow-origin: access-control-max-age: 1800 allow: get, head, post, put, delete, trace, options, patch content-length: 0 server: jetty(9.1.0.m0)

vary: origin

request headers

accept: */*
accept-encoding: gzip, deflate, br
accept-language: zh-cn,zh;q=0.9
access-control-request-method: post
connection: keep-alive
host: 127.0.0.1:10011
origin:


2.1.通過過濾器

@override
public void dofilter(servletrequest request, servletresponse response, filterchain chain) throws ioexception, servletexception 
chain.dofilter(request, response);
}

2.2.如果你用的spring版本在4.2或以上的話，恭喜spring已經支援cors了

2.2.1

通過@crossorigin註解，在某個方法新增，則某個方法可被跨域請求，在某個類上新增，表示該類下的方法都可被跨域請求

2.2.2

通過配置檔案

allowed-origins="*"

allowed-methods="post, get, options, delete, put"

allowed-headers="content-type, access-control-allow-headers, authorization, x-requested-with"

allow-credentials="true" />

跨域問題的解決辦法針對伺服器

跨域問題的解決辦法

跨域解決辦法

跨域解決辦法

跨域問題的解決辦法 針對伺服器

跨域問題的解決辦法

跨域解決辦法

跨域解決辦法

相關推薦

跨域問題的解決辦法針對伺服器