2015-02-23 7 views
7

startowy Appplication:Wiosna Cloud - Zuul Proxy produkuje nie 'Access-Control-Allow-Origin' ajax odpowiedź

@SpringBootApplication 
@EnableZuulProxy 
public class ZuulServer { 

    public static void main(String[] args) { 
     new SpringApplicationBuilder(ZuulServer.class).web(true).run(args); 
    } 
} 

Mój plik YAML jest tak:

server: 
    port:8080 

spring: 
    application: 
     name: zuul 

eureka: 
client: 
    enabled: true 
    serviceUrl: 
     defaultZone: http://localhost:8761/eureka/ 



zuul: 
    proxy: 
     route: 
     springapp: /springapp 

mam aplikacja mikroserwisowa (na porcie 8081) o nazwie springapp i ma kilka usług odpoczynku. Poniżej jest mój klient app UI:

<html> 
    <head> 
     <title>TODO supply a title</title> 
     <meta charset="UTF-8"> 
     <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
     <script type="text/javascript" src="js/libs/jquery/jquery.min.js" ></script> 
    </head> 
    <body> 
     <script type="text/javascript"> 
      $.ajax({ 
       url: 'http://localhost:8080/zuul/springapp/departments', 
       type: 'GET' 
      }).done(function (data) { 
       consoe.log(data); 
       document.write(data); 
      }); 
     </script>   

    </body> 
</html> 

Ale dostaję HTML5 aplikacja

XMLHttpRequest cannot load http://localhost:8080/zuul/springapp/departments. No 
    'Access-Control-Allow-Origin' header is present on the requested 
    resource. Origin 'http://localhost:8383' is therefore not allowed access. 

Ten interfejs jest http://localhost:8383/SimpleAPp/index.html. CORS, CORS, CORS ... Proszę, pomóżcie. BTW http://localhost:8080/zuul/springapp/departments zwraca listę json, jak przypuszczam, kiedy na pasku adresu przeglądarki. Blog 01.mówi, że nie ma potrzeby stosowania filtra, ponieważ zuulproxy zajmuje się tym, ale nie wiem, dlaczego nie działa on dla mnie.

Odpowiedz

20

Dodanie tego kodu do klasy z adnotacją @EnableZuulProxy powinno załatwić sprawę.

@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); 
} 
1

To tylko przeglądarka informująca, że ​​naruszyłeś zasady wspólnego pochodzenia (zobacz Wikipedia entry i ogromną ilość materiałów w Internecie, z których żaden nie jest tak naprawdę związany z dodanymi znacznikami). Możesz nauczyć przeglądarkę, że ładowanie zasobów z innego adresu można przeprowadzić, wykonując kontrole przed lotem CORS (np. W Filter) lub załadować kod HTML za pośrednictwem serwera proxy (wskazówka: ta ostatnia jest znacznie łatwiejsza i mniej podatna na błędy).

+0

Dzięki za próbując odpowiedzieć ale powodem dodałem znaczniki jest z powodu @EnableZuulProxy, który pochodzi z chmury wiosennej. W tym poście na spring.io [blog] (http: // spring.io/blog/2015/01/28/the-api-gateway-pattern-angle-js-and-spring-security-part-iv) mówią, że nie ma potrzeby stosowania tego Filtra, o którym wspomniałeś, ponieważ ZuulProxy robi reverse proxy dla klienta zużywającego. Mam nadzieję, że to ma sens. –

+1

Tak, ale jak mówi @zeroflagL poniżej, oznacza to, że musisz wysyłać wszystkie żądania za pośrednictwem serwera proxy. –

5

Gdy aplikacja działa pod numerem http://localhost:8383, można wykonywać połączenia AJAX tylko pod numerem http://localhost:8383. Zuul nie ma i nie może tego zmienić.

Co może zrobić Zuul to odwzorowanie żądań dla np. http://localhost:8383/zuul/ do http://localhost:8080/zuul/. Ale twoja przeglądarka musiałaby zadzwonić pod numer http://localhost:8383/zuul/springapp/departments i musisz skonfigurować to mapowanie.

+0

Wielkie dzięki. To mi się udało :) Moje drugie pytanie brzmi: co byś zrobił, gdybyś miał kanciastą aplikację js owiniętą w Cordova/Phonegap i używającą statycznych plików w aplikacji zamiast serwować pliki z serwera proxy? Pytam, ponieważ moje rozwiązanie od teraz działa tylko dlatego, że plik statyczny z zapytaniem ajaxowym znajduje się na serwerze ZuulProxy. –

+0

Mam rozwiązanie dla powyższego scenariusza angular.js. Dodałem filtr CORS jak pokazano [tutaj] (https://spring.io/guides/gs/rest-service-cors/) do ZuulProxy. Tak więc każda prośba, która trafi do ZuulProxy z tej samej domeny co proxy lub z innego źródła będzie dozwolona :) –

+0

Jeśli założę, że jest poprawny, [Filtr CORS] (https://spring.io/guides/gs/rest- service-cors /) działa tylko wtedy, gdy aplikacja jest hostowana w kontekście root (/). Jeśli aplikacja jest hostowana w jakimkolwiek innym kontekście, powinieneś zrezygnować z włączania specyfikacji CORS do tego kontenera serwletu. – Stackee007

0

miałem podobny problem, z kątowa aplikacja Web spożywania relaksującego usług realizowanych na wiosennym Boot z Zuul i wiosennym Security.

Żadne z powyższych rozwiązań nie zadziałało. Zdałem sobie sprawę, że problem nie był w Zuul, ale w Spring Security.

Zgodnie z oficjalną dokumentacją (CORS with Spring Security) przy korzystaniu ze Spring Security, CORS musi być skonfigurowany przed Spring Security.

W końcu udało mi się zintegrować rozwiązanie Grinish Nepal (patrz wcześniejsze odpowiedzi) z rozwiązaniem, które działa.

Bez zbędnych ceregieli, oto kod, który umożliwia CORS z wiosennym Bezpieczeństwa i Zuul: `` `

@Configuration 
@EnableWebSecurity 
public class SecurityConfig extends WebSecurityConfigurerAdapter { 
    //irrelevant for this problem 
    @Autowired 
    private MyBasicAuthenticationEntryPoint authenticationEntryPoint; 

    @Override 
    protected void configure(HttpSecurity http) throws Exception { 
     http 
       //configure CORS -- uses a Bean by the name of  corsConfigurationSource (see method below) 
       //CORS must be configured prior to Spring Security 
       .cors().and() 
       //configuring security - irrelevant for this problem 
       .authorizeRequests() 
        .anyRequest().authenticated() 
        .and() 
       .httpBasic() 
       .authenticationEntryPoint(authenticationEntryPoint); 

     //irrelevant for this problem 
     http.addFilterAfter(new CustomFilter(), 
       BasicAuthenticationFilter.class); 
    } 

    //The CORS filter bean - Configures allowed CORS any (source) to any 
    //(api route and method) endpoint 
    @Bean 
    CorsConfigurationSource corsConfigurationSource() { 
     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 source; 
    } 

    //configuring BA usernames and passwords - irrelevant for this problem 
    @Autowired 
    public void configureGlobal(AuthenticationManagerBuilder auth) throws  Exception { 
     ... 
    } 
} 

` ``

+0

Czy dodajesz tę klasę do aplikacji za pomocą aplikacji zuul lub aplikacji z mikroserwisami? – CuriousCoder

Powiązane problemy