Spring Boot：如何解决跨源问题

跨源问题描述

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

被 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 的跨域比较：

URL	Cross-Origin	Reason
https://www.baidu.com/more/index.html	No	Same protocol, domain, and port
https://map.baidu.com/	Yes	Different domain
http://www.baidu.com/index.html	Yes	Different protocol
https://www.baidu.com:81/index.html	Yes	Different port

什么是同源政策？

同源策略是一项基本的浏览器安全功能。如果没有它，浏览器的正常功能可能会受到威胁。 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
    }
}

以上是Spring Boot：如何解决跨源问题的详细内容。更多信息请关注PHP中文网其他相关文章！