cant access JWT token because of CORS using .NetCore - asp.net-core

Question

I have a very strange issue on the back end side of my application,here is my Startup:
public IConfiguration Configuration { get; }
// This method gets called by the runtime. Use this method to add services to the container.
public void ConfigureServices(IServiceCollection services)
{
services.AddMvc().SetCompatibilityVersion(CompatibilityVersion.Version_2_1);
string securityKey = "My_First_Key_generated_by_myself";
var semetricSecurityKey = new SymmetricSecurityKey(Encoding.UTF8.GetBytes(securityKey));
services.AddCors(options =>
{
options.AddPolicy(
"EnableCORS",
builder => builder.AllowAnyOrigin()
.AllowAnyMethod()
.AllowAnyHeader()
.AllowCredentials().Build());
});
services.AddAuthentication().AddJwtBearer(
options =>
{
options.TokenValidationParameters = new Microsoft.IdentityModel.Tokens.TokenValidationParameters
{
ValidateIssuer = true,
ValidateAudience = true,
ValidateIssuerSigningKey = true,
ValidIssuer = "morteza",
ValidAudience = "pass",
IssuerSigningKey = semetricSecurityKey
};
}
);
}
// This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
if (env.IsDevelopment())
{
app.UseDeveloperExceptionPage();
}
app.UseAuthentication();
//app.UseHttpsRedirection();
app.UseCors("EnableCORS");
app.UseMvc();
}
My Athentication Controller to generate Token:
[HttpPost("token")]
// [Authorize]
public ActionResult GetToken(string username)
{
// return Ok("hi Morteza");
if (username == "morteza") {
string securityKey = "My_First_Key_generated_by_myself";
var semetricSecurityKey = new SymmetricSecurityKey(Encoding.UTF8.GetBytes(securityKey));
var claims = new List<Claim>();
claims.Add(new Claim(ClaimTypes.Role, "Admin"));
var signIncredentials = new SigningCredentials(semetricSecurityKey, SecurityAlgorithms.HmacSha256Signature);
var token = new JwtSecurityToken(
issuer: "morteza",
audience: "pass",
expires: DateTime.Now.AddHours(1),
claims: claims,
signingCredentials: signIncredentials);
return Ok(new JwtSecurityTokenHandler().WriteToken(token));
}
else
{
return null;
}
}
I have no idea why I get Access to XMLHttpRequest at 'https://localhost:44361/api/Auth/token/' from origin 'http://localhost:4200' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource when I consume it on the front end?

Answer 1

You need to call app.UseCors() before app.UseAuthentication() because your code at the moment is trying to authenticate before the CORS policy is being applied.
Your Configure method should look like this:
public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
if (env.IsDevelopment())
{
app.UseDeveloperExceptionPage();
}
// Moved this line
app.UseCors("EnableCORS");
app.UseAuthentication();
//app.UseHttpsRedirection();
app.UseMvc();
}
See the documentation on middleware order and recommended order for common services