Ошибка «Access-Control-Allow-Origin» на консоли отладки VSCode, но код 200OK на вкладке сети в Chrome DevTools - PullRequest
Новая
       25

Ошибка «Access-Control-Allow-Origin» на консоли отладки VSCode, но код 200OK на вкладке сети в Chrome DevTools

0 голосов
/ 07 мая 2019

В проекте Angular 7, использующем HttpClient, у меня есть простая строка кода для обработчика кнопки нажатия: 

    this.http
      .get('http://localhost:30123/api/identity/name/' + this.name)
      .subscribe((answer: Identity[]) => {
        this.identities = answer;  // debug does not get here...
      });

, которая выдает эту ошибку на вкладке «Отладка консоли» в VSCode: 

Access to XMLHttpRequest at 'https://dihgldata.ingeniusds.cat/api/identitat/nom/montilla' from origin 'http://localhost:4200' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
[http://localhost:4200/] core.js:15724 {headers: HttpHeaders, status: 0, statusText: "Unknown Error", url: "https://dihgldata.ingeniusds.cat/api/identitat/nom…", ok: false, …}

но ...

Я использую три разных инструмента для тестирования одного и того же URL и получаю правильный ответ от API.

Первый: почтальон.

(Ну, вы знаете: заголовки, CONTENT-TYPE, ... отличаются при отправке из этой утилиты, чем из хрома)

Второе: клиент VS с расширением кода.

(По мнению Почтальона, эти утилиты полезны для тестирования API, но не помогают с ошибками в коде на стороне клиента)

Третье: Chrome DevTools.

Вот мое большое дело. Я перешел на вкладку «Сеть» в Chrome DevTools и вижу ответ API непосредственно перед тем, как он обработан моим кодом, и есть полный ответ со статусом OK-200.

Нет ошибок на вкладке Консоль в Chrome DevTools.

Использование встроенного отладчика VS Code с отслеживанием расширений Chrome никогда не попадает в строку, где ответ назначен локальной переменной, и ошибка отображается в консоли отладки VSCode без какой-либо другой подсказки.

EDIT

Пробовал тот же URL-адрес, что и в Angular HttpClient в адресной строке Chrome, и ответ от того же API отображается правильно.

1 Ответ

1 голос
/ 07 мая 2019

Когда вы делаете запрос на http://localhost:30123/ с любого другого URL, он будет заблокирован политикой CORS (Cross-Origin Resource Sharing), равной http://localhost:30123/.

. Вы должны разрешить CORS с любого URLили только с http://localhost:4200/.

В Java вы можете использовать CORS Filter.https://howtodoinjava.com/servlets/java-cors-filter-example/

...