4.6 CORS 支持跨域

news2024/10/7 20:31:47

CORS (Cross-Origin Resource Sharing ）是由 W3C 制定的一种跨域资源共享技术标准，其目的就是为了解决前端的跨域请求。在 Java EE 开发中，最常见的前端跨域请求解决方案是 JSONP ，但JSONP 只支持 GET 请求，这是个很大的缺陷，而 CORS 则支持多种 HTTP 请求方法。

1. 某个请求实现跨域:@CrossOrigin

import com.ruoyi.common.core.domain.AjaxResult;
import org.springframework.web.bind.annotation.CrossOrigin;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;

@RestController
@RequestMapping("/test")
public class Test1Controller {

    @CrossOrigin(value = "http://localhost:8081", maxAge = 1800, allowedHeaders = "*")
    @PostMapping("/hello")
    public AjaxResult hello() {
        return AjaxResult.success("请求成功");
    }
}

代码解释：

注解@CrossOrigin中的value表示支持的域，这里表示来自http://localhost:8081域的请求是支持跨域的。
maxAge表示探测请求的有效期，在前面的讲解中，读者已经了解到对于DELETE、PUT请求或者有自定义头信息的请求，在执行过程中会先发送探测请求，探测请求不用每次都发送，可以配置一个有效期，有效期过了之后才会发送探测请求。这个属性默认是1800秒，即30分钟。
allowedHeaders表示允许的请求头，*表示所有的请求头都被允许。

8081跨域访问效果
在这里插入图片描述
8082跨域访问效果

2. 全局配置:@CrossOrigin

@Configuration
public class ResourcesConfig implements WebMvcConfigurer {
    /**
     * 跨域配置
     */
    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/book/**")
                .allowedHeaders("*")
                .allowedMethods("*")
                .maxAge(10)
                .allowedOrigins("http://localhost:8083");
    }
}

代码解释：

全局配置需要自定义类实现WebMvcConfigurer接口，然后实现接口中的addCorsMappings方法。
在addCorsMappings方法中，addMapping表示对哪种格式的请求路径进行跨域处理；allowedHeaders表示允许的请求头，默认允许所有的请求头信息；allowedMethods表示允许的请求方法，默认是GET、POST和HEAD,*表示支持所有的请求方法；maxAge表示探测请求的有效期,单位秒；allowedOrigins表示支持的域。

package com.ruoyi.web.controller.test;

import com.ruoyi.common.core.domain.AjaxResult;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;

@RestController
@RequestMapping("/book")
public class BookController {
    @PostMapping("/hello")
    public AjaxResult hello() {
        return AjaxResult.success("book请求成功");
    }
}

8081跨域访问效果
在这里插入图片描述
8082跨域访问效果

对非要求的请求路径进行跨域

registry.addMapping设置为全部,测试

    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/*")
                .allowedHeaders("*")
                .allowedMethods("*")
                .maxAge(10)
                .allowedOrigins("http://localhost:8081");
    }

在这里插入图片描述

ruoyi

@Configuration
public class ResourcesConfig implements WebMvcConfigurer
{
    /**
     * 跨域配置
     */
    @Bean
    public CorsFilter corsFilter()
    {
        CorsConfiguration config = new CorsConfiguration();
        config.setAllowCredentials(true);
        // 设置访问源地址
        config.addAllowedOriginPattern("http://localhost:8081");
        // 设置访问源请求头
        config.addAllowedHeader("*");
        // 设置访问源请求方法
        config.addAllowedMethod("*");
        // 有效期 1800秒
        config.setMaxAge(1800L);
        // 添加映射路径，拦截一切请求
        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
        source.registerCorsConfiguration("/test/**", config);
        // 返回新的CorsFilter
        return new CorsFilter(source);
    }
}