在开发Web应用时,前后端分离架构经常会遇到跨域资源共享(CORS)的问题。为了解决不同域名之间的请求限制,若依框架提供了几种简单有效的跨域配置方式。本篇文章将为你介绍若依框架中如何灵活配置跨域访问。
如果你只想为某个特定的接口或方法启用跨域访问,使用 @CrossOrigin
注解是最便捷的方式。在这个例子中,getUser
方法允许跨域访问,而 delete
方法不允许。
@RestController
@RequestMapping("/system/test")
public class TestController {
// 仅对该方法启用跨域
@CrossOrigin
@GetMapping("/{id}")
public AjaxResult getUser(@PathVariable Integer userId) {
// 返回用户信息的逻辑
}
@DeleteMapping("/{userId}")
public AjaxResult delete(@PathVariable Integer userId) {
// 删除用户的逻辑
}
}
通过 @CrossOrigin
注解,可以为某个接口方法单独开启跨域权限。这个方法简便易用,特别适合仅需部分接口允许跨域请求的场景。
如果某个控制器中的所有接口都需要支持跨域访问,你可以将 @CrossOrigin
注解应用在整个控制器类上。这样,所有的接口都会共享相同的跨域设置。
@CrossOrigin(origins = "http://ruoyi.vip", maxAge = 3600)
@RestController
@RequestMapping("/system/test")
public class TestController {
@GetMapping("/{id}")
public AjaxResult getUser(@PathVariable Integer userId) {
// 返回用户信息的逻辑
}
@DeleteMapping("/{userId}")
public AjaxResult delete(@PathVariable Integer userId) {
// 删除用户的逻辑
}
}
通过这种方式,所有接口都允许指定域名(如 http://ruoyi.vip
)的请求,并且跨域响应缓存时间为3600秒。这种配置非常适用于需要对某个模块中的所有接口都启用跨域访问的场景。
若需为整个项目设置统一的跨域策略,最好的方式是通过全局配置来处理。通过在 ResourcesConfig
类中重写 addCorsMappings
方法,可以让项目中的所有接口都支持跨域访问。以下是两种全局跨域配置的方式。
allowedOrigins
这种方式允许你明确指定允许跨域请求的域名。如果希望所有域名都能发起请求,可以使用 "*"
来表示允许所有来源。
/**
* 全局跨域配置
*/
@Override
public void addCorsMappings(CorsRegistry registry) {
// 允许所有路径跨域
registry.addMapping("/**")
// 允许所有域名跨域
.allowedOrigins("*")
// 是否允许携带凭证(如Cookie)
.allowCredentials(true)
// 允许的请求方式
.allowedMethods("GET", "POST", "DELETE", "PUT")
// 允许的请求头
.allowedHeaders("*")
// 预检请求的缓存时间
.maxAge(3600);
}
在这个配置中,项目的所有路径都允许跨域请求,支持 GET
、POST
、DELETE
和 PUT
等请求方式,并允许携带凭证。maxAge(3600)
表示跨域请求的预检结果会被缓存3600秒,减少预检请求的频率。
allowedOriginPatterns
如果你需要更灵活的域名匹配规则,可以使用 allowedOriginPatterns
方法。它允许你定义域名的通配符规则,比 allowedOrigins
更具扩展性。
/**
* 全局跨域配置
*/
@Override
public void addCorsMappings(CorsRegistry registry) {
// 允许所有路径跨域
registry.addMapping("/**")
// 使用通配符匹配所有域名
.allowedOriginPatterns("*")
// 是否允许携带凭证
.allowCredentials(true)
// 允许的请求方式
.allowedMethods("GET", "POST", "DELETE", "PUT")
// 允许的请求头
.allowedHeaders("*")
// 预检请求的缓存时间
.maxAge(3600);
}
allowedOriginPatterns("*")
与 allowedOrigins("*")
相似,但提供了更灵活的匹配规则,支持复杂的域名匹配需求,例如通过通配符匹配某个子域名范围。
若依框架提供了三种不同的方式来实现跨域访问配置:
@CrossOrigin
注解为单个方法配置跨域访问权限,适合小范围的灵活控制。@CrossOrigin
注解配置整个控制器,使其中的所有方法都支持跨域,适合模块化管理。ResourcesConfig
中的全局配置方法,可以让整个项目统一跨域设置,适合对所有接口进行跨域管理。每种方式都适用于不同的场景,根据需求选择合适的配置方式,可以有效地解决前后端分离架构中的跨域问题。
powered by kaifamiao