Angular2 - HTTPヘッダーアクセスコントロール付きASP MVC Web API

Question

Angular2とASP MVC restサーバーで休憩アプリケーションがあり、通信に問題があります。 私が得る送信すると、私はこのエラーを取得する：私は要求するアクセス制御 - 許可 - 起源を追加すると

No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin ' http://localhost:4200 ' is therefore not allowed access.

は、私はこのエラーを取得する：ここで

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:4200 ' is therefore not allowed access. The response had HTTP status code 404.

は私のコードです：

let headers = new Headers({ 'Access-Control-Allow-Origin': '*' }) 
    this.http.get("http://localhost/App/Users", { withCredentials: true, headers: headers }) 
     .subscribe(response => { 
     console.log("A"); 
     }, error => { 
     console.log(error); 
     }); 

Windows認証では、web.configが有効になっています。 どこに問題がありますか？

Answer 1

ここにCORSの問題があるようです。あなたの角度とWebAPIは、あなたがlocalhostを使用しているのとは異なるポートを使用しています。 （彼らは2つの異なるプロジェクトのようです）。 これを解決するには、 "Install-Package Microsoft.AspNet.WebApi.Cors"を使用してNugetパッケージをインストールし、WebApiConfigファイルで "config.EnableCors（）"と言うだけで済みます。今では角の部分にさらされているAPIは、CORSがそこで使用されるはずであることを伝えなければなりません。したがって、原点、ヘッダー、およびメソッドについてのコントローラの属性を記述することができます。その後はうまくいくはずです。 詳細については、このリンクを確認してください。 https://docs.microsoft.com/en-us/aspnet/web-api/overview/security/enabling-cross-origin-requests-in-web-api