Zuul網關跨域問題

1.跨域就指着協議，域名，端口不一致，出於安全考慮，跨域的資源之間是無法交互的。簡單說就是協議不通，域名不通，端口不同都會產生跨域問題

Access-Control-Allow-Origin是HTML5中定義的一種解決資源跨域的策略。他是通過服務器端返回帶有Access-Control-Allow-Origin標識的Response header，用來解決資源的跨域權限問題。

2.單個應用解決跨域問題

@Configuration
public class CorsConfig extends WebMvcConfigurerAdapter {
    static final String[] ORIGINS = new String[]{"GET", "POST", "PUT", "DELETE"};

    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**")
                //可訪問ip，ip最好從配置文件中獲取，
                .allowedOrigins("*")
                .allowedMethods(ORIGINS)
                //.allowedHeaders("*")
                .exposedHeaders("access-control-allow-headers",
                        "access-control-allow-methods",
                        "access-control-allow-origin",
                        "access-control-max-age",
                        "X-Frame-Options",
                        "token",
                        "channel")
                .allowCredentials(true).maxAge(3600);
    }
}

或者可以使用Filter

@Component
public class CorsFilter implements Filter {
    @Override
    public void doFilter(ServletRequest req, ServletResponse res, FilterChain chain) throws IOException, ServletException {
        HttpServletResponse response = (HttpServletResponse) res;
 
        HttpServletRequest reqs = (HttpServletRequest) req;
 
        // response.setHeader("Access-Control-Allow-Origin",reqs.getHeader("Origin"));
        response.setHeader("Access-Control-Allow-Origin","*");
        response.setHeader("Access-Control-Allow-Credentials", "true");
        response.setHeader("Access-Control-Allow-Methods", "POST, GET, PATCH, DELETE, PUT");
        response.setHeader("Access-Control-Max-Age", "3600");
        response.setHeader("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
        chain.doFilter(req, res);
    }
 
    @Override
    public void init(FilterConfig filterConfig) {}
 
    @Override
    public void destroy() {}
 
}

3.如果是在微服務環境中，網關層會首先做跨域問題解決。

@Bean
public CorsFilter corsFilter() {
    final UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
    final CorsConfiguration config = new CorsConfiguration();
    config.setAllowCredentials(true); // 允許cookies跨域
    config.addAllowedOrigin("*");// 允許向該服務器提交請求的URI，*表示全部允許。。這里盡量限制來源域，比如http://xxxx:8080 ,以降低安全風險。。
    config.addAllowedHeader("*");// 允許訪問的頭信息,*表示全部
    config.setMaxAge(18000L);// 預檢請求的緩存時間（秒），即在這個時間段里，對於相同的跨域請求不會再預檢了
    config.addAllowedMethod("*");// 允許提交請求的方法，*表示全部允許，也可以單獨設置GET、PUT等
    config.addAllowedMethod("HEAD");
    config.addAllowedMethod("GET");// 允許Get的請求方法
    config.addAllowedMethod("PUT");
    config.addAllowedMethod("POST");
    config.addAllowedMethod("DELETE");
    config.addAllowedMethod("PATCH");
    source.registerCorsConfiguration("/**", config);
    return new CorsFilter(source);
}

4.如果在微服務環境中，網關層做了跨域問題解決，單個服務也做了跨域問題處理，這時就會出現*多次配置問題

這時候需要在Zuul配置忽略頭部信息

zuul:
#需要忽略的頭部信息，不在傳播到其他服務
  sensitive-headers: Access-Control-Allow-Origin
  ignored-headers: Access-Control-Allow-Origin,H-APP-Id,Token,APPToken