公司的前后端開發(fā)項(xiàng)目工程，在本地調(diào)試的時(shí)候遇到了跨域的問題，同事調(diào)我的服務(wù)一直提示跨域問題，然后前端nb他自己在哪里做了跨域處理，類似nginx那種，但是我還是百度去看了一下，在一個(gè)大佬的博客中發(fā)現(xiàn)了解決方案。

問題原因是是寫的判斷登錄的filter影響了登錄，原因是的這個(gè)filter執(zhí)行順序在corsfilter之前導(dǎo)致，于是修改了一下跨域設(shè)置的配置文件

解決方案

/**
 * 使用CORS，用于解決ajax跨域訪問問題
 */
@Configuration
public class GlobalCorsConfig {
    @Bean
    public FilterRegistrationBean corsFilter() {
        //1.添加CORS配置信息
        CorsConfiguration config = new CorsConfiguration();
        //1) 允許的域,不要寫*，否則cookie就無法使用了
        //config.addAllowedOrigin("http://manage.leyou.com");
        //config.addAllowedOrigin("http://www.leyou.com");
        config.addAllowedOrigin("*");
        //2) 是否發(fā)送Cookie信息
        config.setAllowCredentials(true);
        //3) 允許的請(qǐng)求方式
        config.addAllowedMethod("OPTIONS");
        config.addAllowedMethod("HEAD");
        config.addAllowedMethod("GET");
        config.addAllowedMethod("PUT");
        config.addAllowedMethod("POST");
        config.addAllowedMethod("DELETE");
        config.addAllowedMethod("PATCH");
        config.setMaxAge(3600L);
        // 4）允許的頭信息
        config.addAllowedHeader("*");
 
        //2.添加映射路徑，我們攔截一切請(qǐng)求
        UrlBasedCorsConfigurationSource configSource = new UrlBasedCorsConfigurationSource();
        configSource.registerCorsConfiguration("/**", config);
 
        //3.返回新的CorsFilter.
        //return new CorsFilter(configSource);
 
        FilterRegistrationBean bean = new FilterRegistrationBean(new CorsFilter(configSource));
        bean.setOrder(0);
        return bean;
    }
}

跨域配置CorsFilter不生效原因

項(xiàng)目中有多個(gè)Filter時(shí)，需要通過 @Order(Ordered.HIGHEST_PRECEDENCE) 注解設(shè)置過濾器的執(zhí)行順序

order的規(guī)則

1. order的值越小，優(yōu)先級(jí)越高

2. order如果不標(biāo)注數(shù)字，默認(rèn)最低優(yōu)先級(jí)，因?yàn)槠淠J(rèn)值是int最大值

3. 該注解等同于實(shí)現(xiàn)Ordered接口getOrder方法，并返回?cái)?shù)字。

如果使用如下注釋掉的方法進(jìn)行設(shè)置跨域，F(xiàn)ilter的doFilter()方法中直接return出去時(shí)，前端會(huì)提示跨域

因?yàn)檫@個(gè)CorsConfig并沒有實(shí)現(xiàn)Filter接口，即使加上 @Order 注解也不會(huì)生效，需要通過如下新的方式返回一個(gè)新的FilterRegistrationBean出去，并設(shè)置order

import com.nanase.takeshi.constants.JwtConstant;
import lombok.extern.slf4j.Slf4j;
import org.springframework.boot.web.servlet.FilterRegistrationBean;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.core.Ordered;
import org.springframework.web.cors.CorsConfiguration;
import org.springframework.web.cors.UrlBasedCorsConfigurationSource;
import org.springframework.web.filter.CorsFilter;
/**
 * CorsConfig
 * 跨域請(qǐng)求配置
 *
 * @author 725
 * @date 2020/12/10 18:17
 */
@Slf4j
@Configuration
public class CorsConfig {
    private CorsConfiguration buildConfig() {
        CorsConfiguration corsConfiguration = new CorsConfiguration();
        // 1 設(shè)置訪問源地址
        corsConfiguration.addAllowedOrigin("*");
        // 2 設(shè)置訪問源請(qǐng)求頭
        corsConfiguration.addAllowedHeader("*");
        // 3 設(shè)置訪問源請(qǐng)求方法
        corsConfiguration.addAllowedMethod("*");
        // 4 暴露哪些頭部信息
        corsConfiguration.addExposedHeader(JwtConstant.HEADER);
        return corsConfiguration;
    }
    /**
	@Bean
    public CorsFilter corsFilter() {
        log.info("跨域設(shè)置。。。。");
        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
        // 對(duì)接口配置跨域設(shè)置
        source.registerCorsConfiguration("/**", buildConfig());
        return new CorsFilter(source);
    }
    */
    
    @Bean
    public FilterRegistrationBean<CorsFilter> corsFilter() {
        log.info("跨域設(shè)置。。。。");
        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
        // 5 對(duì)接口配置跨域設(shè)置
        source.registerCorsConfiguration("/**", buildConfig());
        //有多個(gè)filter時(shí)此處設(shè)置改CorsFilter的優(yōu)先執(zhí)行順序
        FilterRegistrationBean<CorsFilter> bean = new FilterRegistrationBean<>(new CorsFilter(source));
        bean.setOrder(Ordered.HIGHEST_PRECEDENCE);
        return bean;
    }
}

以上為個(gè)人經(jīng)驗(yàn)，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。

您可能感興趣的文章: