小编imp*_*zeb的帖子

如何在Zuul中使用CORS作为API网关+ AngularJS +微服务

我有一个使用Zuul Netflix作为API网关的应用程序,其体系结构如下:

在此处输入图片说明

该架构运行良好,可以使用浏览器和邮递员从微服务(服务1、2和3)访问不同的REST端点。但是,当我尝试在前端Web应用程序(AngularJS WebApp)中使用它时,在chrome控制台中给我以下错误。

XMLHttpRequest cannot load http://localhost:8080/person/api/all. Response for preflight is invalid (redirect)
Run Code Online (Sandbox Code Playgroud)

如果要设置@CrossOrigin注释,则可以通过自己的地址和端口使用服务。但是,当通过网关访问它时@CrossOrigin,其余端点上没有任何注释将不起作用。

试图在我的安全性配置中创建以下过滤器,但仍然无法正常工作,而是在chrome控制台中出现了以下错误。

@Bean
    public CorsFilter corsFilter() {
        final UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
        final CorsConfiguration config = new CorsConfiguration();
        config.setAllowCredentials(true);
        config.addAllowedOrigin("*");
        config.addAllowedHeader("*");
        config.addAllowedMethod("OPTIONS");
        config.addAllowedMethod("HEAD");
        config.addAllowedMethod("GET");
        config.addAllowedMethod("PUT");
        config.addAllowedMethod("POST");
        config.addAllowedMethod("DELETE");
        config.addAllowedMethod("PATCH");
        source.registerCorsConfiguration("/**", config);
        return new CorsFilter(source);
    }
Run Code Online (Sandbox Code Playgroud)

浏览器控制台(Chrome)...

XMLHttpRequest cannot load http://localhost:8080/person/api/all. Redirect from 'http://localhost:80/person/api/all' to 'http://localhost:80' has been blocked by CORS policy: Request requires preflight, which is disallowed to follow cross-origin redirect.
Run Code Online (Sandbox Code Playgroud)

以下是示例AngularJS …

java spring netflix-zuul api-gateway

5
推荐指数
1
解决办法
3804
查看次数

标签 统计

api-gateway ×1

java ×1

netflix-zuul ×1

spring ×1