Error Description:- XMLHttpRequest cannot load http://localhost:50913/api/values. 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.
Use Case: Posting the data from Angular 4 form http://localhost:4200 to ASP.NET Core Web API http://localhost:50913/api/values
Solution:- For resolving the CORS (Cross Origin Resource Sharing ) issue CORS needs to be enabled on Web API. No action required on Angular 4 form.
Add the below highlighted code in Startup.cs
public void ConfigureServices(IServiceCollection services)
{
services.AddCors();
services.AddMvc();
}
public void Configure(IApplicationBuilder app, IHostingEnvironment env, ILoggerFactory loggerFactory) { app.UseCors(b => b.WithOrigins("http://localhost:4200").AllowAnyHeader().AllowAnyMethod()); app.UseMvc(); } Microsoft Reference for Enabling Cross-Origin Requests (CORS) Click Here