ИСПРАВЛЕНИЕ: нет ошибки заголовка access-control-allow-origin в Angular

Одно из наиболее распространенных сообщений об ошибках, с которыми разработчики Angular могут столкнуться в своей повседневной работе: на запрошенном ресурсе отсутствует заголовок access-control-allow-origin.

Это не конкретная проблема Angular, а проблема CORS (Cross-Origin Resource Sharing) проблема с заголовком. Это может означать, что внутренний сервер настроен для работы с другим портом или доменом.

---

Как исправить ошибку Нет контроля доступа в Windows 10?

1. Вносите изменения на уровне сервера

Если у вас есть доступ к серверу, включите запросы CROS, добавив Доступ-Контроль-Разрешить-Происхождение: * заголовок. После этого настраиваем корс запись, под system.webServer в web.config файл, как в примере ниже.

• ”1.0″?
• включен ="правда">
• origin =“ https://someorigin.domain.com”>
• метод ="ПОЛУЧАТЬ"/>
• метод ="ГЛАВА"/>
• </system.webServer>

Здесь, корс позволит ПОЛУЧАТЬ а также ГЛАВА запросы от https://someorigin.domain.com/.

Кроме того, если вы используете IIS (информационные службы Интернета) вам нужно будет скачать Модуль IIS CORS.

Будьте внимательны при указании домена или списка доменов вместо *. В противном случае запросы к серверу из разных источников будут разрешены откуда угодно.

На Apache, в конфигурационном файле нужно добавить строку Заголовок установлен Access-Control-Allow-Origin ‘*’. Опять же, разумно заменить "*" списком источников, из которых будут отправляться запросы.

---

2. Запустите свой собственный прокси-сервер

1. Во-первых, мы создадим файл конфигурации прокси в корневой папке Angular с именем src / proxy.conf.json, и напишите в нем следующий код:
   • {"/ api":
   • "цель":" http://localhost: 6000 "," secure ": false}
   • }
2. Во-вторых, в ангular.jsonфайл, добавьте proxyConfigвариант в обслуживать цель:
   • "обслуживать": {
   • "строитель":" ",
     
   • "параметры":{"proxyConfig":"src / proxy.conf.json"}
     
   • }
3. Теперь запустите текущую конфигурацию с нг подавать команда.

Прокси-сервер будет перенаправлять ваши запросы на удаленный сервер. Далее мы посмотрим, как настроить прокси-сервер.

Запросы данных в Angular - это вызовы API к localhost через порт 4200, например, в этом месте:

• http://localhost: 4200 / api / datareq.

Однако в приведенном выше примере мы предположили, что запрошенные данные находятся в это место:

• http://localhost: 6000 / api / datareq.

---

Заинтересованы в хороших прокси-решениях? Ознакомьтесь с этим списком специальных инструментов

---

3. Dвозможность использования той же политики происхождения в вашем браузере

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

Если все остальное не работает, вы можете прибегнуть к отключению той же политики происхождения в браузере. Однако будьте осторожны, так как это подвергнет ваш браузер (и вашу систему) серьезным рискам безопасности.

Для Гугл Хромв Windows 10 откройте командную строку от имени администратора и выполните следующую команду:

C: Программные файлы (x86) GoogleChromeApplicationchrome.exe "--disable-web-security --disable-gpu --user-data-dir = ~ / chromeTemp..

В заключении, на запрошенном ресурсе отсутствует заголовок access-control-allow-origin сообщение об ошибке - проблема на стороне сервера.

Для разработчиков Angular изменение конфигурации сервера или использование прокси-сервера должно работать нормально.

Расскажите нам, что вы думаете об этом руководстве, в разделе комментариев ниже.

---

---