1

Tengo un problema con un proyecto que estoy haciendo, y es que no consigo conectar la parte backend con la frontend.

La parte backend está echa con Java, Spring Boot y Eclipse, mientras que la frontend está hecha con Angular y VisualStudioCode. En Java, cuando le doy a la opción de ejecutar como aplicacion de Spring Boot, funciona todo correctamente, tengo de pruebas una ruta en que me devuelve un JSON:

introducir la descripción de la imagen aquí

Con angular tengo el siguiente código que se supone que me tendría que devolver dicho JSON y mostrarlo por consola:

  prueba(){
    // https://restcountries.eu/rest/v2/all
    return this.http.get("https://localhost:8080/hello").pipe(
      map(resp => {
        console.log(resp);
      })
    );
  }

Esta función se ejecuta cuando le doy a un botón determinado. He probado con otras APIs públicas de internet y su comportamiento es el correcto, pero cuando ejecuto la función, la respuesta que me sale es el error "Http failure response for https://localhost:8080/hello: 0 Unknown Error". El error completo que me salta es el siguiente:

introducir la descripción de la imagen aquí

¿Alguna idea de cómo solucionar esto?

2
  • tienes antes de ese error otro al GET que hace referencia al ssl, prueba a cambiar por un protocolo no seguro return this.http.get("http://localhost:8080/hello").pipe( o a añadir una confirmación del ssl Commented el 18 sept. 2020 a las 7:59
  • Al cambar la ruta https por http me sale el segundo error que está desplegado en la imagen, pero con dos diferentes anteriores: Primero este: Access to XMLHttpRequest at 'http://localhost:8080/hello' from origin 'http://localhost:4200' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource., y luego este: GET http://localhost:8080/hello net::ERR_FAILED.
    – Victor
    Commented el 18 sept. 2020 a las 8:11

1 respuesta 1

1

La solución estaba en habilitar los CORS desde Java de la siguiente forma:

Primero: Añadiendo en la cabecera de la clase @EnableWebMvc.

Segundo: Implementando en la clase WebMvcConfigurer

Tercero: Sobrescribiendo los métodos que marca, pero teniendo en cuenta el que se llama addCorsMappings(), que quedaría de la siguiente forma:

    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**")
        .allowedOrigins("*")
        .allowedMethods("POST","GET")
        .allowedHeaders("*")
        .allowCredentials(false).maxAge(3600);
        
    }

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.