'Why isn't my browser setting the httpCookie cookie automatically upon request?

I have ASP.NET Web API that utilizes .NET 6 and I'm trying to send a cookie in a response. To be more specific I'm trying to send a response that contains a httpOnly cookie.

The request comes from http://localhost:8080/login and it's sent to the server at https://localhost:7212/auth/login which sends the response back to http://localhost:8080/login.

As far as I know this can't and shouldn't be set by the client manually.

The idea here is that the client requests a response from the server, the server replies with a response and the client sets the cookie automatically.

What I have on the server is this

public ActionResult Login()
{
    HttpContext.Response.Cookies.Append( "Token", "AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA",
    new CookieOptions
    {
        HttpOnly = true
    });
    return Ok();
}

And the client requests a response from that endpoint like so

function getToken() {
axios.post('https://localhost:7212/auth/login')
  .then(function (response) {
    console.log(response);
  })
  .catch(function (error) {
    console.log(error);
  });
}

And when using Insomnia to inspect the request, it manages to catch the cookie.

enter image description here enter image description here

BUT! When looking at the cookies section in my browser, either Chrome or Firefox, there is no cookie set. enter image description here

I do get a successful 200 response back from the server in the browser. enter image description here

I personally was told that you can't automagically set a cookie with a response, but that seems to be a false statement. Because looking at this video on YouTube we can clearly see that when he makes a request to the endpoint and switches back to the browser, without setting the token manually with the help of JavaScript, the token has been set.

This is how CORS has been configured in Program.cs

var MyAllowSpecificOrigins = "_myAllowSpecificOrigins";
var builder = WebApplication.CreateBuilder(args);
ConfigurationManager configuration = builder.Configuration;

builder.Services.AddAuthentication(JwtBearerDefaults.AuthenticationScheme)
    .AddJwtBearer(options =>
    {
        options.TokenValidationParameters = new TokenValidationParameters
        {
            ValidateIssuer = true,
            ValidateAudience = true,
            ValidateLifetime = true,
            ValidateIssuerSigningKey = true,
            ValidIssuer = configuration["Jwt:Issuer"],
            ValidAudience = configuration["Jwt:Issuer"],
            IssuerSigningKey = new SymmetricSecurityKey(Encoding.UTF8.GetBytes(configuration["Jwt:Key"]))
        };
    });

builder.Services.AddCors(options =>
{
    options.AddPolicy(name: MyAllowSpecificOrigins,
                      builder =>
                      {
                          builder.WithOrigins("http://localhost:8080");

                      });
});

builder.Services.AddMvc();
builder.Services.AddControllers();
builder.Services.AddEndpointsApiExplorer();
builder.Services.AddSwaggerGen();

var app = builder.Build();
if (app.Environment.IsDevelopment())
{
    app.UseSwagger();
    app.UseSwaggerUI();
}
app.UseCors(MyAllowSpecificOrigins);
app.UseAuthentication();
app.UseHttpsRedirection();
app.UseAuthorization();
app.MapControllers();
app.Run();

What's actually going on here and what am I doing wrong that causes the cookie to not be set like it is in the video.



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source