Я обслуживал угловое приложение через порт 4202 и подключался к приложению remove spring mvc с помощью приведенного ниже кода.
this.http.post<Hero[]>('http://localhost:8080/api/hero/list', {"id":1}, httpOptions)
Но он сообщил об ошибке ниже.
Failed to load http://localhost:8080/api/hero/list: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:4202' is therefore not allowed access. The response had HTTP status code 403.
Поэтому я попытался включить cors в своем весеннем веб-приложении с помощью аннотации ниже в методе контроллера.
@CrossOrigin(origins = "http://localhost:4202")
Я также попытался добавить класс конфигурации, как показано ниже.
@Configuration
@EnableWebMvc
public class WebConfig extends WebMvcConfigurerAdapter {
@Override
public void addCorsMappings(CorsRegistry registry) {
registry.addMapping("/**");
}
}
Затем я обновляю интерфейс интерфейса, как сказано ниже.
Failed to load http://localhost:8080/api/hero/list: The 'Access-Control-Allow-Origin' header contains multiple values 'http://localhost:4202, *', but only one is allowed. Origin 'http://localhost:4202' is therefore not allowed access.
Затем я проверил свою сеть Chrome, как показано ниже, она действительно дублировала заголовок «Access-control-allow-origin».
Затем я много гуглил, нашел, что другие ребята столкнулись с этой проблемой, так как другой веб-сервер перед tomcat генерирует вторую голову «Access-control-allow-origin». Но у меня есть только один сервер tomcat, за исключением сервера, запущенного с помощью «ng serve».
Затем я попытался посетить этот URL (http://localhost:8080/api/hero/list ) непосредственно скрипачом вместо углового. И ниже скриншот, я могу обнаружить, что нет дублированного «Access-Control-Allow-Origin».
Итак, я догадался, было ли это вызвано сервером nodejs, запущенным angular? Поскольку я был новичком в angular, я не знаю, как разобраться в этой проблеме. Спасибо.