Sring Boot. Не удалось получить данные. Возможные причины: ошибка сети CORS. Схема URL должна быть “http” или “https” для запроса CORS.

Вопрос или проблема

@Configuration
public class WebConfig implements WebMvcConfigurer {
    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**")
                .allowedOrigins("*")
                .allowedMethods("GET", "POST", "PUT", "DELETE", "OPTIONS")
                .allowedHeaders("*");
    }
}

@Configuration
public class SwaggerConfig {
@Bean
public OpenAPI customOpenAPI() {
    return new OpenAPI()
            .servers(List.of(new Server().url("https://exciting-wonder-production.up.railway.app")));
}
}

@Configuration
public class WebConfig implements WebMvcConfigurer {
@Override
public void addCorsMappings(CorsRegistry registry) {
    registry.addMapping("/**")
            .allowedOrigins("https://exciting-wonder-production.up.railway.app")
            .allowedMethods("GET", "POST", "PUT", "DELETE", "OPTIONS")
            .allowedHeaders("*")
            .allowCredentials(true);
}
}

Ответ или решение

Решение проблемы CORS с использованием Swagger в приложении Spring Boot

При использовании Swagger для документирования и тестирования вашего API возникла проблема с ошибкой «Failed to fetch. Possible Reasons: CORS, Network Failure, URL scheme must be "http" or "https" for CORS request». Это распространенная проблема, связанная с механизмом Cross-Origin Resource Sharing (CORS), и давайте разберем возможные причины и способы ее устранения.

Основные причины возникновения проблемы

1. Неправильные настройки CORS: Если ваше приложение на Spring Boot не настроено для обработки запросов с других источников, браузер блокирует такие запросы, что приводит к ошибке CORS.

2. Несоответствие схемы URL: Если вы используете http для запросов на сервер, который поддерживает только https, это может вызвать ошибки. browsers условно блокируют такие запросы.

3. Конфигурация Swagger: Swagger UI может не соответствовать правильному URL-адресу, что также может привести к проблемам.

Шаги для решения проблемы

1. Настройка CORS:
   Вам уже удалось добавить класс конфигурации WebConfig, но необходимо отредактировать его так, чтобы разрешить запросы только из вашего настроенного URL. Это поможет ограничить доступ к вашему API с определённых источников.

   @Configuration
   public class WebConfig implements WebMvcConfigurer {
      @Override
      public void addCorsMappings(CorsRegistry registry) {
          registry.addMapping("/**")
                  .allowedOrigins("https://exciting-wonder-production.up.railway.app")
                  .allowedMethods("GET", "POST", "PUT", "DELETE", "OPTIONS")
                  .allowedHeaders("*")
                  .allowCredentials(true);
      }
   }

   Заменив allowedOrigins("*") на ваш URL, вы ограничиваете доступ к API только с этого приложения Swagger.

2. Конфигурация Swagger:
   Обновите конфигурацию Swagger, чтобы указать правильный URL-адрес вашего API. Это гарантирует, что Swagger ссылается на ваш API через HTTPS.

   @Configuration
   public class SwaggerConfig {
      @Bean
      public OpenAPI customOpenAPI() {
          return new OpenAPI()
                  .servers(List.of(new Server().url("https://exciting-wonder-production.up.railway.app")));
      }
   }

3. Проверка окружения:
   Убедитесь, что ваше приложение настроено правильно для работы с HTTPS. Если для локальной разработки используется http, проверьте, что все ссылки корректны при развертывании.

4. Тестирование через Postman:
   Если вы можете сделать запрос через Postman, это подтверждает, что API работает, и проблема в конфигурации CORS или Swagger. Обратите внимание на то, что Postman не использует CORS и не подвержен таким же ограничениям, как браузеры.

5. Кеш браузера:
   Иногда кеш браузера может сохранить старые записи. Попробуйте очистить кеш или использовать режим инкогнито, чтобы протестировать изменения.

Заключение

Если вы следовали всем указанным шагам и все еще сталкиваетесь с проблемами, возможно, стоит изучить логи вашего приложения на предмет других ошибок, которые могут указывать на проблемы с сетевыми соединениями. Также убедитесь, что ваш сервер Railway настроен правильно для обработки CORS-запросов и что все зависимости вашего приложения актуальны.

Надеюсь, это поможет вам решить проблему с CORS при использовании Swagger на вашем API, развернутом в Railway!