SpringBoot解决跨域的几种方式

ゞ浴缸里的玫瑰 2024-03-23 19:36 82阅读 0赞

## SpringBoot解决跨域的几种方式 ##

跨域资源共享（CORS）：通过修改Http协议header的方式，实现跨域。说的简单点就是，通过设置HTTP的响应头信息，告知浏览器哪些情况在不符合同源策略的条件下也可以跨域访问，浏览器通过解析Http协议中的Header执行具体判断。具体的Header如下：

CORS跨域常用header

*  Access-Control-Allow-Origin: 允许哪些ip或域名可以跨域访问
 *  Access-Control-Max-Age: 表示在多少秒之内不需要重复校验该请求的跨域访问权限
 *  Access-Control-Allow-Methods: 表示允许跨域请求的HTTP方法，如：GET,POST,PUT,DELETE
 *  Access-Control-Allow-Headers: 表示访问请求中允许携带哪些Header信息，如：Accept、Accept-Language、Content-Language、Content-Type

### 1、使用CorsFilter进行全局跨域配置【推荐】 ###

import org.springframework.context.annotation.Bean;  
    import org.springframework.context.annotation.Configuration;  
    import org.springframework.http.HttpMethod;  
    import org.springframework.web.cors.CorsConfiguration;  
    import org.springframework.web.cors.UrlBasedCorsConfigurationSource;  
    import org.springframework.web.filter.CorsFilter;  
    import org.springframework.web.servlet.config.annotation.CorsRegistry;  
    import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;
    
    /**
    
    - TODO 全局跨域处理
      
    
    - @author ss_419
      
    - @version 1.0
      
    - @date 2023/2/23 16:20  
      */@Configuration  
      public class GlobalCorsConfig {
          
       @Bean  
       public CorsFilter corsFilter() {
        
      
       CorsConfiguration config = new CorsConfiguration();  
       // 开放那些IP、端口、域名的访问权限，"*" 表示开放所有域  
       config.addAllowedOrigin("*");  
       // 是否发送Cookie信息  
       config.setAllowCredentials(true);  
       // 允许的请求方式  
       config.addAllowedMethod(HttpMethod.GET);  
       config.addAllowedMethod(HttpMethod.POST);  
       config.addAllowedMethod(HttpMethod.PUT);  
       config.addAllowedMethod(HttpMethod.DELETE);  
       // 允许HTTP请求中携带那些Header信息  
       config.addAllowedHeader("*");  
      
      
      // config.addExposedHeader("*");
      
    
       // 添加映射路径，"/**"  表示对所有的路径实行全局跨域访问权限的设置  
       UrlBasedCorsConfigurationSource configurationSource = new UrlBasedCorsConfigurationSource();  
       configurationSource.registerCorsConfiguration("/**", config);  
      
       return new CorsFilter(configurationSource);  
      
      
      }
    }

#### 2、 **重写WebMvcConfigurer的addCorsMappings方法（全局跨域配置）**【推荐】 ####

import org.springframework.context.annotation.Bean;
    import org.springframework.context.annotation.Configuration;
    import org.springframework.http.HttpMethod;
    import org.springframework.web.cors.CorsConfiguration;
    import org.springframework.web.cors.UrlBasedCorsConfigurationSource;
    import org.springframework.web.filter.CorsFilter;
    import org.springframework.web.servlet.config.annotation.CorsRegistry;
    import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;
    
    /**
     * TODO 全局跨域处理
     *
     * @author ss_419
     * @version 1.0
     * @date 2023/2/23 16:20
     */
    @Configuration
    public class GlobalCorsConfig {
        
       
    
        @Bean
        public WebMvcConfigurer corsConfigurer() {
        
            return new WebMvcConfigurer() {
        
                @Override
                public void addCorsMappings(CorsRegistry registry) {
        
                    registry.addMapping("/**")// 添加映射路径，"/**"表示对所有的路径进行全局跨域访问权限的设置
                            .allowedOrigins("*")// 开放那些ip、端口、域名的访问权限
                            .allowCredentials(true)// 是否允许发送Cookie信息
                            .allowedMethods("*")// 开放那些HTTP方法，允许跨域访问
                            .allowedHeaders("*")// 允许HTTP请求中携带那些Header信息
    //                        .exposedHeaders("*")// 暴露那些头部信息（因为跨域访问默认不能获取全部头部信息）
                            .maxAge(3600);// 预检请求的缓存时间（秒），即在这个时间段里，对于相同的跨域请求不会再预检了
    
                }
            };
        }
    }

#### 3、使用CrossOrigin注解（局部跨域配置） ####

将CrossOrigin注解加在Controller层的方法上，该方法定义的RequestMapping端点将支持跨域访问  
将CrossOrigin注解加在Controller层的类定义处，整个类所有的方法对应的RequestMapping端点都将支持跨域访问

@RequestMapping("/cors")
    @ResponseBody
    @CrossOrigin(origins = "http://localhost:8080", maxAge = 3600) 
    public String cors( ){
        
     return "cors";
    }

#### 4、**使用HttpServletResponse设置响应头(局部跨域配置)** ####

@RequestMapping("/cors")
    @ResponseBody
    public String cors(HttpServletResponse response){
        
        //使用HttpServletResponse定义HTTP请求头，最原始的方法也是最通用的方法
        response.addHeader("Access-Control-Allow-Origin", "http://localhost:8080");
        return "cors";
    }

#### 5、通过nginx解决 ####

server{
        listen 8081;
        server_name localhost;
    
        #add_header 'Access-Control-Allow-Origin' '*';
        #add_header 'Access-Control-Allow-Headers' '*';
        #add_header 'Access-Control-Allow-Methods' '*';
    
        location / {
            root html;
            index index.html index.htm;
        }
        # 跨域请求转发
        location /cors/ { 
            proxy_pass http://localhost:8080/user/;
        }
    }