從剛接觸對接接口起，跨域這個問題就一直發(fā)生在我的身上，當然同事的身上也時常發(fā)生，一直到現(xiàn)在，已經(jīng)解決過測試過超級多個跨域相關(guān)的問題了，現(xiàn)在就來總結(jié)一下，其中的原因和解決方法。
ajax跨域的表現(xiàn)
ajax請求時,如果存在跨域現(xiàn)象,并且沒有進行解決,會出現(xiàn)下面幾種錯誤現(xiàn)象:
第一種現(xiàn)象:No 'Access-Control-Allow-Origin' header is present on the requested resource,并且The response had HTTP status code 404
出現(xiàn)這種情況的原因如下：
本次ajax請求是“非簡單請求”,所以請求前會發(fā)送一次預(yù)檢請求(OPTIONS)
服務(wù)器端后臺接口沒有允許OPTIONS請求,導(dǎo)致無法找到對應(yīng)接口地址
解決方案: 后端允許options請求
第二種現(xiàn)象:No 'Access-Control-Allow-Origin' header is present on the requested resource,并且The response had HTTP status code 405
這種現(xiàn)象和第一種有區(qū)別,這種情況下，后臺方法允許OPTIONS請求,但是一些配置文件中(如安全配置),阻止了OPTIONS請求,才會導(dǎo)致這個現(xiàn)象
解決方案: 后端關(guān)閉對應(yīng)的安全配置
第三種現(xiàn)象:No 'Access-Control-Allow-Origin' header is present on the requested resource,并且status 200
這種現(xiàn)象和第一種和第二種有區(qū)別,這種情況下，服務(wù)器端后臺允許OPTIONS請求,并且接口也允許OPTIONS請求,但是頭部匹配時出現(xiàn)不匹配現(xiàn)象
比如origin頭部檢查不匹配,比如少了一些頭部的支持(如常見的X-Requested-With頭部),然后服務(wù)端就會將response返回給前端,前端檢測到這個后就觸發(fā)XHR.onerror,導(dǎo)致前端控制臺報錯
解決方案: 后端增加對應(yīng)的頭部支持
第四種現(xiàn)象:heade contains multiple values '*,*'
表現(xiàn)現(xiàn)象是，后臺響應(yīng)的http頭部信息有兩個Access-Control-Allow-Origin:*
說實話，這種問題出現(xiàn)的主要原因就是進行跨域配置的人不了解原理，導(dǎo)致了重復(fù)配置，如:
常見于.net后臺(一般在web.config中配置了一次origin,然后代碼中又手動添加了一次origin(比如代碼手動設(shè)置了返回*))
常見于.net后臺(在IIS和項目的webconfig中同時設(shè)置Origin:*)
解決方案(一一對應(yīng)):
建議刪除代碼中手動添加的*，只用項目配置中的即可
建議刪除IIS下的配置*，只用項目配置中的即可
