Доступ к XMLHttpRequest по адресу http://localhost:56557/api/tw/' из источника http://localhost:4200' был заблокирован политикой CORS:

Question

Я получаю следующую ошибку. Когда я пытался отправить запрос из angular 5.0.

Поле заголовка запроса access-control-allow-origin не разрешено Access-Control-Allow-Headers в ответе перед полетом.

(с использованием Postman, вызов APIработает)

следующий угловой код

let config = {
      headers: {
         "Content-Type": "application/json,charset=utf-8",
         "access-control-allow-origin": "*",
         "access-control-allow-methods": "GET, POST, PUT, DELETE, OPTIONS",
         "access-control-allow-headers": "Origin, X-Requested-With, Content-Type, Accept, Authorization"

        }
      }

    let obs = this.httpClient.post('http://localhost:56557/api/tw/',bodypara,config);

---

следующий - изменения веб-конфигурации

<system.webServer>
    <handlers>
      <remove name="ExtensionlessUrlHandler-Integrated-4.0" />
      <!--<remove name="OPTIONSVerbHandler" />-->
      <remove name="TRACEVerbHandler" />
      <!--<add name="ExtensionlessUrlHandler-Integrated-4.0" path="*." verb="*" type="System.Web.Handlers.TransferRequestHandler" preCondition="integratedMode,runtimeVersionv4.0" />-->
      <add name="Browser Link for HTML" path="*.html" verb="*"
         type="System.Web.StaticFileHandler, System.Web, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a"
         resourceType="File" preCondition="integratedMode" />
    </handlers>
    <validation validateIntegratedModeConfiguration="false" />
    <modules>
      <remove name="ApplicationInsightsWebTracking" />
      <add name="ApplicationInsightsWebTracking" type="Microsoft.ApplicationInsights.Web.ApplicationInsightsHttpModule, Microsoft.AI.Web" preCondition="managedHandler" />
    </modules>
  <httpProtocol>
        <customHeaders>
          <add name="Access-Control-Allow-Origin" value="*" />
          <add name="Access-Control-Allow-Headers" value="Origin, X-Requested-With, Content-Type, Accept, Authorization" />
          <add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE, OPTIONS" />
        </customHeaders>
      </httpProtocol>




  </system.webServer>

Answer 1

Вы сказали своему приложению, что заголовки access-control-allow-* не разрешены, не включив их в параметры Access-Control-Allow-Headers:

<add name="Access-Control-Allow-Headers" value="Origin, X-Requested-With, Content-Type, Accept, Authorization" />

Вот почему вы видите ошибку.

Кроме того, заголовки access-control-allow-* являются заголовками ответов и обычно в любом случае игнорируются сервером. Просто удалите их из вашего запроса.