」工欲善其事,必先利其器。「—孔子《論語.錄靈公》
首頁 > 程式設計 > Spring Boot:如何解決跨來源問題

Spring Boot:如何解決跨來源問題

發佈於2024-11-08
瀏覽:112

Spring Boot: How to Solve Cross-Origin Issues

跨源问题描述

您可能会遇到以下错误消息:

被 CORS 策略阻止:请求的资源上不存在“Access-Control-Allow-Origin”标头

此错误表示对某个地址的请求已被 CORS 协议阻止,因为资源中缺少 Access-Control-Allow-Origin 标头。

分析跨源问题

跨域问题的根本原因是浏览器出于安全考虑,限制访问当前站点之外的资源。

例如,考虑托管在 http://127.0.0.1:8080/ 且具有特定页面的网站。如果您从同一站点访问资源,则没有任何限制。但如果您尝试从其他站点访问资源(例如http://127.0.0.1:8081),浏览器将阻止该请求。

注意:我们将协议、域和端口视为定义“同源”的一部分。

具有 src 属性的元素,例如 img 和 script 标签,不受此限制。

历史上,当前端和后端不分离时,页面和请求接口存在于同一个域和端口下。然后,浏览器将允许来自一个域托管的页面的请求从同一域请求资源。

例如http://127.0.0.1:8080/index.html可以自由请求http://127.0.0.1:8080/a/b/c/userLit.

现在,前端和后端分离到不同的应用程序中,这是不允许的,并且会引发 CORS 问题。

什么是起源和跨起源?

来源(或源)由协议、域和端口号组成。

URL 由协议、域、端口和路径组成。如果两个 URL 的协议、域和端口都相同,则它们被视为“同源”。这三个元素中任何一个的差异都会构成跨域请求。

考虑 https://www.baidu.com/index.html 的跨域比较:

网址 跨源 原因
https://www.baidu.com/more/index.html 相同的协议、域和端口
https://map.baidu.com/ 是的 不同域
http://www.baidu.com/index.html 是的 不同协议
https://www.baidu.com:81/index.html 是的 不同端口

什么是同源政策?

同源策略是一项基本的浏览器安全功能。如果没有它,浏览器的正常功能可能会受到威胁。 Web 架构很大程度上依赖于此策略,浏览器实现它以确保安全。

同源策略包括:

  1. DOM 同源策略:防止不同源页面的 DOM 操作。主要适用于跨域iframe场景,不同域的iframe不能互相访问。
  2. XMLHttpRequest 同源策略:禁止使用 XHR 对象向不同来源发出 HTTP 请求。

解决Spring Boot中的跨源问题

1. 创建一个过滤器来处理 CORS

在前后端分离部署的项目中,解决CORS至关重要。 Cookie用于存储用户登录信息,Spring拦截器管理权限。当拦截器和 CORS 以错误的顺序处理时,就会出现问题,导致 CORS 错误。

HTTP 请求在到达 servlet 之前首先经过过滤器,然后到达拦截器。为了确保 CORS 处理发生在授权拦截之前,我们可以将 CORS 配置放在过滤器中。

@Configuration
public class CorsConfig {

    @Bean
    public CorsFilter corsFilter() {
        CorsConfiguration corsConfiguration = new CorsConfiguration();
        corsConfiguration.addAllowedOrigin("*");
        corsConfiguration.addAllowedHeader("*");
        corsConfiguration.addAllowedMethod("*");
        corsConfiguration.setAllowCredentials(true);

        UrlBasedCorsConfigurationSource urlBasedCorsConfigurationSource = new UrlBasedCorsConfigurationSource();
        urlBasedCorsConfigurationSource.registerCorsConfiguration("/**", corsConfiguration);
        return new CorsFilter(urlBasedCorsConfigurationSource);
    }
}

2.在WebMvcConfigurer中配置CORS

虽然 JSONP 可以解决前端的跨域问题,但它仅支持 GET 请求,这在 RESTful 应用程序中受到限制。相反,您可以使用后端的跨源资源共享 (CORS) 来处理跨源请求。该方案并非Spring Boot独有,在传统的SSM框架中也有使用。您可以通过实现 WebMvcConfigurer 接口并重写 addCorsMappings 方法来配置它。

@Configuration
public class CorsConfig implements WebMvcConfigurer {

    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**")
                .allowedOrigins("*")
                .allowCredentials(true)
                .allowedMethods("GET", "POST", "PUT", "DELETE", "OPTIONS")
                .maxAge(3600);
    }
}

3. 在控制器中配置CORS

您可以通过在@RequestMapping注解中添加@CrossOrigin注解来为特定控制器方法启用CORS。默认情况下,@CrossOrigin允许@RequestMapping中指定的所有来源和HTTP方法。

@RestController
@RequestMapping("/account")
public class AccountController {

    @CrossOrigin
    @GetMapping("/{id}")
    public Account retrieve(@PathVariable Long id) {
        // ...
    }

    @DeleteMapping("/{id}")
    public void remove(@PathVariable Long id) {
        // ...
    }
}

了解@CrossOrigin参数:

  • @CrossOrigin不带参数允许所有URL访问。
  • @CrossOrigin(origins = "http://127.0.0.1:8080") 限制对指定URL的访问。
  • 该注解可以用在类或方法上。
  • value 或 origins 属性指定允许的 URL。
  • maxAge 指示预检请求缓存的最大期限(以秒为单位)。
  • allowedCredentials 指示是否允许凭据 (cookie)。默认为 false。
  • allowedHeaders 指定允许的请求标头。
  • methods 指定允许的请求方法,默认为 GET、POST、HEAD。

@CrossOrigin 可能不起作用的原因

  1. Spring MVC 版本必须为 4.2 或更高版本才能支持@CrossOrigin。
  2. 由于服务器响应不当,错误的请求可能会显示为跨源问题。
  3. 如果在 Controller 注释上方添加 @CrossOrigin 仍然会导致问题,一种可能的解决方法是在 @RequestMapping 中指定 HTTP 方法。

例子:

@CrossOrigin
@RestController
public class PersonController {

    @RequestMapping(method = RequestMethod.GET)
    public String add() {
        // some code
    }
}
版本聲明 本文轉載於:https://dev.to/wilson_evan_1efa5910f8855/spring-boot-how-to-solve-cross-origin-issues-4non?1如有侵犯,請聯絡[email protected]刪除
最新教學 更多>

免責聲明: 提供的所有資源部分來自互聯網,如果有侵犯您的版權或其他權益,請說明詳細緣由並提供版權或權益證明然後發到郵箱:[email protected] 我們會在第一時間內為您處理。

Copyright© 2022 湘ICP备2022001581号-3