vue axios + spring boot + spring security 跨域問題

1. 問題概述：

spring cloud config server, 做成數據庫保存配置信息，然后有一堆刪除改查的controller。

那么現在比如有這樣一個/service/applications的RestController, 正常可以訪問。

 

后來為了安全，加上了

spring:
  security:
    basic:
      enabled: true
    user:
      name: user
      password: password

然后在postman， 加上Authorization頭， 訪問也成功

可是，然后可是，到了axios， 就是各種不成功：

 

2. 原因：

瀏覽器會先發一個OPTIONS請求， 在這個請求里，會去掉Authorizaiton: Basic ....的頭。這個和axios無關。

而spring cloud config server, 因為加上認證, 所以引入了spring security. 導致OPTIONS請求不成功。所以要對spring security進行配置，讓它可以通過這個OPTIONS請求。

 

3. 解決方法：

所以除了要有以下配置:

@Configuration
public class CorsConfig { 
    
    private CorsConfiguration buildConfig() {
        CorsConfiguration corsConfiguration = new CorsConfiguration(); 
        corsConfiguration.addAllowedOrigin("*"); 
        corsConfiguration.addAllowedHeader("*"); 
        corsConfiguration.addAllowedMethod("*"); 
        corsConfiguration.setAllowCredentials(true);
        return corsConfiguration; 
    } 
    
    @Bean 
    public CorsFilter corsFilter() { 
        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource(); 
        source.registerCorsConfiguration("/**", buildConfig()); 
        return new CorsFilter(source); 
    }     
}

還要有：(這個是重點，兩個函數二選一即可）

 

@Configuration
public class WebSecurityConfig extends WebSecurityConfigurerAdapter {

//	@Override
//	public void configure(HttpSecurity http) throws Exception {
//		http.cors();
//	}

	@Override
	public void configure(WebSecurity web) throws Exception {
		web.ignoring().antMatchers(HttpMethod.OPTIONS, "/**");
	}
}

 

這樣就可以了。

 

2019.6.6 再補充一個，這個用的時候沒有spring security, 不知道有了spring security會不會不好用。

@Configuration
public class CorsConfig implements WebMvcConfigurer {    // java 8 不用使用 WebMvcConfigurerAdapter, 因為java 8的接口有默認實現，這個是eclipse提示的。
 
    @Override
    public void addCorsMappings(CorsRegistry registry) {
        System.out.println("----------------------");
        registry.addMapping("/**")
                .allowedOrigins("*")
                .allowCredentials(true)
                .allowedMethods("OPTIONS", "GET", "POST", "DELETE", "PUT")
                .maxAge(3600);
    }
}

 

2019.6.16  再補充一個interceptor版本的(因為使用了攔截器，導致上面那種（2019.6.6）配置無效, 這個沒有使用spring security）

public class JwtInterceptor extends HandlerInterceptorAdapter {
    
    @Override
    public boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object handler) throws Exception {
        
        String origin = request.getHeader("Origin"); 
        response.setHeader("Access-Control-Allow-Origin", origin); 
        response.setHeader("Access-Control-Allow-Methods", "*"); 
        response.setHeader("Access-Control-Allow-Headers","Origin,Content-Type,Accept,token,X-Requested-With"); 
        response.setHeader("Access-Control-Allow-Credentials", "true");
        
        String token = request.getHeader("MyToken");
        if(token == null) {
            throw new UserLoginException("用戶未登錄");
        }
        
        JwtUtil.checkToken(token);
        
        return true;
    }
    
        
}