My application is working fine in IE browser, But it's not working in Chrome browser due to CORS
issue.
The issue is
Failed to load http://localhost:52487/api/Authentication/: The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'. Origin 'http://localhost:4200' is therefore not allowed access. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.
I am using angular 2 in front-end and using Asp.net core 1.0 in back-end. I have tried
This is my startup code
public void ConfigureServices(IServiceCollection services)
{
services.AddCors(options =>
{
options.AddPolicy("AllowAll", p =>
{
p.AllowAnyOrigin()
.AllowAnyHeader()
.AllowAnyMethod();
});
});
// Add framework services.
services.AddMvc();
// Add functionality to inject IOptions<T>
services.AddOptions();
// Add our Config object so it can be injected
services.Configure<Data>(Configuration.GetSection("Data"));
services.Configure<COCSettings>(Configuration.GetSection("COCSettings"));
services.Configure<EmailSettings>(Configuration.GetSection("EmailSettings"));
AppSettings.ConnectionString = Configuration["Data:DefaultConnectionString"];
// *If* you need access to generic IConfiguration this is **required**
services.AddSingleton<IConfiguration>(Configuration);
// Injecting repopsitories with interface
AddServices(services);
// Add Json options
services.AddMvc().AddJsonOptions(options => options.SerializerSettings.ContractResolver = new DefaultContractResolver());
}
// This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
public void Configure(IApplicationBuilder app, IHostingEnvironment env, ILoggerFactory loggerFactory)
{
loggerFactory.AddConsole(Configuration.GetSection("Logging"));
loggerFactory.AddDebug();
app.UseMiddleware(typeof(ErrorHandling));
app.UseMiddleware(typeof(GetNoCache));
app.UseCors("AllowAll");
app.UseMvc();
}
this is how I am calling the API from UI(angular) side
constructor(private http: Http) {
this.headers = new Headers();
this.headers.append('Accept', 'application/json');
}
GetMaintainCOC(FYONId) {
return this.http.get(this.apiUrl + 'GetCertificationofConformity?FYONId=' + FYONId, { withCredentials: true })
.map(responce => <any>responce.json())
.catch(error => {
return Observable.throw(error);
});
}
It is working, when I am calling AllowCredentials()
inside of AddPolicy
services.AddCors(options =>
{
options.AddPolicy("AllowAll", p =>
{
p.AllowAnyOrigin()
.AllowAnyHeader()
.AllowAnyMethod()
.AllowCredentials();
});
});
I got this key of idea from Access-Control-Allow-Origin: "*" not allowed when credentials flag is true, but there is no Access-Control-Allow-Credentials header
I am using
{ withCredentials: true }
in angularhttp
service call. So I guess I should useAllowCredentials()
policy inCORS
service.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With