在咱們開發當中 常常會遇見跨域問題 今天我來講下 我在工做撞見的跨域;html
一.首先咱們要了解跨域存在的緣由前端
一、瀏覽器限制jquery
二、跨域(域名,端口不同都是跨域)nginx
三、XHR(XMLHttpRequest請求)git
從XHR(XMLHttpRequest)出發github
避免發生跨域。使用jsonp,因爲jsonp請求是經過script的方式發送的(只有xhr的請求方式纔有可能產生跨域問題),因此不會產生跨域問題。Spring MVC實現過程:前臺使用ajax的get請求,將dataType設爲「jsonp」;服務器建立一個類並繼承抽象類AbstractJsonReponseBodyAdvice,最後註解@ControllerAdivece。使用jsonp的弊端,只能使用get方式請求,服務器須要改動代碼,發送的不是xhr請求。ajax
方式二:使用jQuery的jsonp插件
插件下載網址:https://github.com/jaubourg/jquery-jsonp
前端代碼
spring
服務器代碼
apache
使用該方式的特色:與方式一相比,請求方式不僅侷限於get請求,還能夠是post請求,但從服務器從獲取的數據依然是jsonp格式json
產生跨域後解決。
從被調用方考慮,有三種狀況,分別是服務器實現,nginx配置和apache配置。
服務器實現須要注意兩種狀況,簡單請求和非簡單請求。簡單請求是先執行請求再驗證,非簡單請求是先驗證再請求。
簡單請求(比較常見):方法爲get,head,post,請求header裏面沒有自定義頭,Content-Type的值爲如下幾種 text/plain,multipart/form-data,application/x-www-form-urlencoded。
非簡單請求(比較常見):put,delect方法的ajax請求,發送json格式的ajax請求,帶自定義頭的ajax請求。
簡單請求處理方案:在響應頭中添加
Access-Control-Allow-Origin=「容許跨域的url」,即跨省域時,請求頭Origin的值,因此通常是獲取Origin的值。
Access-Control-Allow-Method=「*」,容許的方法。
非簡單請求處理方案:在相應頭中添加
Access-Control-Allow-Origin=「容許跨域的url」,即跨域時,能夠獲取請求頭Origin的值。
Access-Control-Allow-Method=「*」,容許的方法
Access-Control-Request-Headers=「Content-Type,自定義的header的key」。
帶cookies的跨域解決:在響應頭添加
Access-Control-Allow-Credentials,="true",容許使用cookies
ngnix配置:
apache配置:沒搞過
如果使用spring框架:使用@CrossOrigin註解既能夠實現服務端跨域
server { listen 80; server_name www.a.com; access_log logs/test.access.log; # 匹配以/apis/開頭的請求 location ^~ /apis/ { proxy_pass http://www.b.com/; #注意域名後有一個/ } location / { root html/a; index index.html index.htm; } # error_page 500 502 503 504 /50x.html; location = /50x.html { root html; } }
沒錯就是proxy_pass後面的地址加一個/