springboot 中通过cors协议解决跨域问题

淩亂°似流年 2022-05-16 04:30 161阅读 0赞

**1、对于前后端分离的项目来说，如果前端项目与后端项目部署在两个不同的域下，那么势必会引起跨域问题的出现。**

针对跨域问题，我们可能第一个想到的解决方案就是jsonp，并且以前处理跨域问题我基本也是这么处理。

但是jsonp方式也同样有不足，不管是对于前端还是后端来说，写法与我们平常的ajax写法不同，同样后端也需要作出相应的更改。并且，jsonp方式只能通过get请求方式来传递参数，当然也还有其它的不足之处，针对于此，我并没有急着使用jsonp的方式来解决跨域问题，去网上找寻其它方式，也就是本文主要所要讲的，在springboot中通过cors协议解决跨域问题。

**2、Cors协议**

H5中的新特性：Cross-Origin Resource Sharing（跨域资源共享）。通过它，我们的开发者（主要指后端开发者）可以决定资源是否能被跨域访问。

cors是一个w3c标准，它允许浏览器（目前ie8以下还不能被支持）像我们不同源的服务器发出xmlHttpRequest请求，我们可以继续使用ajax进行请求访问。

具体关于cors协议的文章 ，可以参考http://www.ruanyifeng.com/blog/2016/04/cors.html 这篇文章，讲的相当不错。

**3、在springboot中如何通过cors协议解决跨域问题**

springmvc4.2版本增加了对cors的支持。

目前我所做的项目基本都是springboot进行开发，所以我这里贴下在springboot中的使用。

@Configuration
    public class WebMvcConfig extends WebMvcConfigurationSupport {
    
        @Value("${hxx.imagePath}")
        private String imagePath;
        @Value("${hxx.uploadPath}")
        private String filePath;
    
        @Bean
        public HttpMessageConverter<String> responseBodyConverter() {
            StringHttpMessageConverter converter = new StringHttpMessageConverter(Charset.forName("UTF-8"));
            return converter;
        }
    
    
    //    @Override
    //    public void configureMessageConverters(List<HttpMessageConverter<?>> converters) {
    //    	System.out.println("----"+this.getMessageConverters().size());
            converters.add(responseBodyConverter());
    //        //增加controller响应消息json转换器；在controller直接返回对象可自动转换为json
            converters.add(new MappingJackson2HttpMessageConverter(new ConfigurableObjectMapper()));
    //        super.configureMessageConverters(converters);
    //        System.out.println("-----"+converters.size());
    //    }
    
    
        @Override
        public void addResourceHandlers(ResourceHandlerRegistry registry) {
            registry.addResourceHandler("/**").addResourceLocations("classpath:/META-INF/resources/").setCachePeriod(0);
            registry.addResourceHandler("/css/**")
                    .addResourceLocations("classpath:/css/");
            registry.addResourceHandler("/js/**").addResourceLocations("classpath:/js/");
            registry.addResourceHandler("/editor/**").addResourceLocations("classpath:/editor/");
            registry.addResourceHandler("/ftl/**").addResourceLocations("classpath:/view/");
            registry.addResourceHandler("/images/**").addResourceLocations("file:" + imagePath);
            registry.addResourceHandler("/file/**").addResourceLocations("file:" + imagePath);
            super.addResourceHandlers(registry);
        }
    
        /*保留国际化*/
        @Bean
        public LocaleChangeInterceptor interceptor() {
            LocaleChangeInterceptor interceptor = new LocaleChangeInterceptor();
            interceptor.setParamName("lang");
            return interceptor;
        }
    
        @Override
        public void addInterceptors(InterceptorRegistry registry) {
            registry.addInterceptor(interceptor());
            registry.addInterceptor(new UrlResolveInterceptor());
        }
    
        @Bean
        public LocaleResolver resolver() {
            SessionLocaleResolver resolver = new SessionLocaleResolver();
            resolver.setDefaultLocale(Locale.US);
            return resolver;
        }
      @Override
        public void addCorsMappings(CorsRegistry registry) {
               registry.addMapping("/api/**")
               .allowedOrigins("http://192.168.1.97")
               .allowedMethods("GET", "POST")
               .allowCredentials(false).maxAge(3600);
        }
    }

其父类WebMvcConfigurationSupport 中有方法

/**
    	 * Override this method to configure cross origin requests processing.
    	 * @since 4.2
    	 * @see CorsRegistry
    	 */
    	protected void addCorsMappings(CorsRegistry registry) {
    	}

重写这个方法就可以实现跨域

用法事例如下

@Override
        public void addCorsMappings(CorsRegistry registry) {
               registry.addMapping("/api/**")
               .allowedOrigins("http://192.168.1.97")
               .allowedMethods("GET", "POST")
               .allowCredentials(false).maxAge(3600);
        }

学到的老铁双击点赞！