何が欠けているのかわかりませんが、.NET Core 3.1およびAngular 8クライアント側でCORSポリシーを機能させることができないようです。
Startup.cs
:
public void ConfigureServices(IServiceCollection services)
{
// ...
// Add CORS policy
services.AddCors(options =>
{
options.AddPolicy("foo",
builder =>
{
// Not a permanent solution, but just trying to isolate the problem
builder.AllowAnyOrigin().AllowAnyMethod().AllowAnyHeader();
});
});
services.AddControllers();
}
public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
{
if (env.IsDevelopment())
{
app.UseDeveloperExceptionPage();
}
app.UseHttpsRedirection();
// Use the CORS policy
app.UseCors("foo");
app.UseRouting();
app.UseAuthorization();
app.UseEndpoints(endpoints =>
{
endpoints.MapControllers();
});
}
エラーメッセージクライアント側:
Access to XMLHttpRequest at 'https://localhost:8082/api/auth/' from Origin 'http://localhost:4200' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
私はwas CORSを誤って構成しました(そして、以下の受け入れられた回答は実際にそれを助けました)問題の根本は無関係でした。追加のコンテキストとして、APIおよびAngularアプリをCLIを使用して実行すると、アプリは完全に正常に機能していました-両方をWebサーバーにデプロイした後にのみこの問題が発生していました。
"actual"の問題はSQL接続に関連していることが判明しました。これは、APIにフラットファイルエラーログを追加し、SQL Serverトレースを実行してアプリが実行できなかったことを発見した後にのみ発見されましたSQLに接続します。
通常、これは500を返すだけで、10秒以内に問題が発生すると思っていましたが、CORSの設定ミスにより、CORSミドルウェアが最初に失敗したため、500が実際に返されることはありませんでした。 これは絶対に控えめに言っても非常にイライラしました!。しかし、もし私が「間違ったうさぎを追いかけていた」ので、もしそうなら、他の人がこの状況に陥った場合に備えて、ここにそれを付け加えたいと思います。 CORS構成を修正した後、実際の問題はCORSとはまったく無関係であることに気付きました
参照:
https://medium.com/swlh/cors-headers-with-dot-net-core-3-5c9dfc664785
最初にapp.UseRouting();
次にapp.UseCors("foo");
Configure
メソッドを次のように変更します。
public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
{
if (env.IsDevelopment())
{
app.UseDeveloperExceptionPage();
}
app.UseHttpsRedirection();
app.UseRouting(); // first
// Use the CORS policy
app.UseCors("foo"); // second
app.UseAuthorization();
app.UseEndpoints(endpoints =>
{
endpoints.MapControllers();
});
}
それは私のために働いた!
Web APIはapp.UseHttpsRedirection()
を使用しています。これは、リクエストしているクライアントがCORS
ベースでない場合にhttps
の問題を引き起こします。したがって、http
クライアントで使用するには、コメント化するか、その行を削除する必要があります。
この問題はCORS
では発生しません。httpsが原因でこの問題が発生していますが、スローされたエラーがCORSに関するものです。
。NET CORE 3.1の場合
最良の方法は、Originパスをapp.settingsファイルに保存することです
"Origins": {
"Server": "http://localhost:5001/",
"Client": "http://localhost:4200/",
"CorsOrigins": "http://localhost:4200,http://localhost:5001"
}
ConfigureServices
メソッドで、構成セクションの起点を定義します
services.AddCors(
options => options.AddPolicy(
PolicyNames.AllowOrigins,
builder => builder
.WithOrigins(
Configuration["Origins:CorsOrigins"]
.Split(",", StringSplitOptions.RemoveEmptyEntries)
.Select(s => s.TrimEnd('/'))
.ToArray()
)
.AllowAnyHeader()
.AllowAnyMethod()
.AllowCredentials()
)
);
最後に、Configure
メソッドでcorsを使用するだけです(使用順は関係ありません!)
app.UseCors(PolicyNames.AllowOrigins); //Enable CORS!
このユーティリティを試す
https://www.nuget.org/packages/Microsoft.AspNetCore.Cors/ これを使用すると、.netコアアプリケーションでcorsを有効/無効にできます
Localhostをhttp://localhost:4200
として使用しているので、構成に設定してみます。
public void ConfigureServices(IServiceCollection services)
{
services.AddCors(options => options.AddPolicy("ApiCorsPolicy", build =>
{
build.WithOrigins("http://localhost:4200")
.AllowAnyMethod()
.AllowAnyHeader();
}));
// ... other code is omitted for the brevity
}
}
そしてConfigure
メソッド:
public void Configure(IApplicationBuilder app, IHostingEnvironment env, IServiceProvider provider)
{
if (env.IsDevelopment())
{
app.UseDeveloperExceptionPage();
}
app.UseCors("ApiCorsPolicy");
app.UseHttpsRedirection();
app.UseAuthentication();
app.UseMvc();
}
Corsサービスを追加するときは、.SetIsOriginAllowed((Host) => true)
の後に必ず.WithOrigins("http://localhost:4200")
を含めてください。
services.AddCors(options => {
options.AddPolicy("mypolicy",builder => builder
.WithOrigins("http://localhost:4200/")
.SetIsOriginAllowed((Host) => true)
.AllowAnyMethod()
.AllowAnyHeader());
});