溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

使用Java如何解決跨域問題

發(fā)布時間:2021-10-29 09:42:09 來源:億速云 閱讀:226 作者:iii 欄目:web開發(fā)

本篇內(nèi)容主要講解“使用Java如何解決跨域問題”,感興趣的朋友不妨來看看。本文介紹的方法操作簡單快捷,實用性強。下面就讓小編來帶大家學習“使用Java如何解決跨域問題”吧!

跨域問題

現(xiàn)在絕大多數(shù)公司的項目都是前后端分離的,前后端分離后勢必會遇到跨域問題。如下圖

使用Java如何解決跨域問題

繼續(xù)debug發(fā)現(xiàn),reponse為undefined,提示消息為Network Error。

使用Java如何解決跨域問題

所以當你和前端聯(lián)調(diào)的時候一直請求失敗,報網(wǎng)絡錯誤,一般情況下是后端沒有做跨域配置。

注意此時并不是后端沒有收到請求,而是收到請求了,也返回結(jié)果了,但是瀏覽器將結(jié)果攔截了,并且報錯。

同源策略

那么瀏覽器為什么會報錯呢?

因為瀏覽器基于安全考慮而引入的同源策略

使用Java如何解決跨域問題

當協(xié)議+域名+端口三者都相同時,才不會產(chǎn)生跨域問題,即同源。此時才能讀取到服務端的響應

當前url請求url是否跨域
https://www.javashitang.comhttp://www.javashitang.com是,協(xié)議不同
https://www.javashitang.comhttp://book.javashitang.com是,域名不同
https://www.javashitang.comhttp://www.javashitang.com:8000是,端口不同

為什么要有同源策略呢?

當然是為了安全起見,舉個例子,以銀行轉(zhuǎn)賬為例,看看你的錢是怎么沒的

使用Java如何解決跨域問題

這就是著名的CSRF攻擊(跨站請求偽造,當然還有很多其他方式),還有如果第5步不對請求的來源進行校驗,那么你的錢已經(jīng)被轉(zhuǎn)走了

html頁面中的如下三個標簽是允許跨域加載資源的

 <img src=XXX>  <link href=XXX>  <script src=XXX>

如何解決跨域

雖然同源策略保證了安全,但一些合理的用途也會受到影響。解決跨域的方式有很多種,簡單介紹2個

JSONP

JSONP主要是利用<script>標簽將請求發(fā)送出去,來實現(xiàn)數(shù)據(jù)的加載,但這種方式有一個缺點,即只能支持GET請求,其他請求都不能支持,因為JSONP這種方式已經(jīng)很少使用了,所以不做過多的介紹

CROS

非簡單請求

在正式的跨域請求前,發(fā)送一個OPTIONS請求去詢問服務器是否接受接下來的跨域請求,攜帶如下header

Origin:發(fā)起請求原來的域

  • Access-Control-Request-Method:將要發(fā)起的跨域請求方式(GET/POST/&hellip;)

  • Access-Control-Request-Headers:將要發(fā)起的跨域請求中包含的請求頭字段

服務器在返回中增加如下header來表明是否允許這個跨域請求。瀏覽器收到后進行檢查如果不符合要求則不會發(fā)起后續(xù)請求

  • Access-Control-Allow-Origin:允許哪些域來訪問(*表示允許所有域的請求)

  • Access-Control-Allow-Methods:允許哪些請求方式

  • Access-Control-Allow-Headers:允許哪些請求頭字段

  • Access-Control-Allow-Credentials:是否允許攜帶Cookie

簡單請求

每次都要發(fā)送二次請求是不是很麻煩?所以做了優(yōu)化

當請求方法是HEAD、GET、POST

并且請求頭只有如下幾個時,被定義為簡單請求

Accept Accept-Language Content-Language Last-Event-ID Content-Type:(application/x-www-form-urlencoded、multipart/form-data、text/plain)

簡單請求會在請求中加入Origin頭,直接發(fā)起請求,不會先詢問了。后端返回相應的header即可

Spring支持跨域

理解了跨域的本質(zhì),再看各種配置其實就是根據(jù)請求往reponse中增加header

利用Filter

配置如下Filter,CrossDomainFilter是對javax.servlet.Filter的封裝,本質(zhì)上是一個Filter。

可以看到我多返回了一個header,Access-Control-Max-Age,他表明了詢問結(jié)果的有效期限,即在3600s之內(nèi)瀏覽器可以不必再次詢問

@Component @WebFilter(filterName = "crossDomain", urlPatterns = "/*") public class CrossDomainFilter extends OncePerRequestFilter {      @Override     protected void doFilterInternal(HttpServletRequest request, HttpServletResponse response, FilterChain filterChain) throws ServletException, IOException {         // 此處可以進行白名單檢測         if(CorsUtils.isCorsRequest(request)) {             response.setHeader("Access-Control-Allow-Origin", request.getHeader("Origin"));             response.setHeader("Access-Control-Allow-Credentials", "true");             response.setHeader("Access-Control-Allow-Headers", request.getHeader("Access-Control-Request-Headers"));             response.setHeader("Access-Control-Allow-Methods", request.getHeader("Access-Control-Request-Method"));             response.setHeader("Access-Control-Max-Age", "3600");         }         // 是個OPTIONS請求,header已設好,不用執(zhí)行后續(xù)邏輯,直接return         if(CorsUtils.isPreFlightRequest(request)) {             return;         }         filterChain.doFilter(request, response);     } }

看一下用到的工具類

public abstract class CorsUtils {      // 請求中有 origin 這個header則返會true     public static boolean isCorsRequest(HttpServletRequest request) {         return (request.getHeader(HttpHeaders.ORIGIN) != null);     }      public static boolean isPreFlightRequest(HttpServletRequest request) {         return (isCorsRequest(request) && HttpMethod.OPTIONS.matches(request.getMethod()) &&                 request.getHeader(HttpHeaders.ACCESS_CONTROL_REQUEST_METHOD) != null);     }  }

利用CorsRegistry

@Configuration public class GlobalCorsConfig {      @Bean     public WebMvcConfigurer corsConfigurer() {         return new WebMvcConfigurer() {             @Override             public void addCorsMappings(CorsRegistry registry) {                 // 添加映射路徑                 registry.addMapping("/**")                         // 允許的域                         .allowedOrigins("*")                         // 允許攜帶cookie                         .allowCredentials(true)                         // 允許的請求方式                         .allowedMethods("GET","POST", "PUT", "DELETE")                         // 允許的請求頭                         .allowedHeaders("*");             }         };     } }

利用@CrossOrigin注解

支持更細粒度的配置,可以用法方法上或者類上

@RestController @RequestMapping("resource") @CrossOrigin({"http://127.0.0.1:8080"}) public class ResourceController

其他方式支持跨域

看到這你可能會產(chǎn)生疑問,我們的項目中沒有跨域的配置啊,怎么還能支持跨域?那估計是把設置header這些活交給網(wǎng)關層來做了。

到此,相信大家對“使用Java如何解決跨域問題”有了更深的了解,不妨來實際操作一番吧!這里是億速云網(wǎng)站,更多相關內(nèi)容可以進入相關頻道進行查詢,關注我們,繼續(xù)學習!

向AI問一下細節(jié)

免責聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點不代表本網(wǎng)站立場,如果涉及侵權(quán)請聯(lián)系站長郵箱:is@yisu.com進行舉報,并提供相關證據(jù),一經(jīng)查實,將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI