C#•4w ago

Identity, .NET Api and Angular client

Oh boy... anyone knows if its better to use cookies or token based authentication with Identity, Angular and .NET Api ? Are cookies a good practice, in my case ? I have an Angular application for the client, a .Net Api for the server, postgreSQL database with Identity. Everything seems to work just fine if I use Swagger to login and then to check WeatherForecast endpoint. I was following this guide : https://learn.microsoft.com/en-us/aspnet/core/security/authentication/identity-api-authorization?view=aspnetcore-9.0&source=recommendations . But when I send requests from my Angular client, it doesn't work yet. I created a component to login, with withCredentials: true and then Set-Cookie header is kind of blocked by my browser, I think. It says (when I inspect the Cookies in my browser) that it blocks the cookie because SameSite = Lax while it is cross-origin 🤔 I think its because i am including credentials in cross origin request. But I can't understand more than that with the documentation I found : https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch#including_credentials . Can someone help me ? I need to know if its because I am, for example, not supposed to use cookies if I use an Angular application (I dont use Razor pages, MVC app or Blazor) ? Also, if cookies is still a good idea, can someone help me understand what is wrong here ? Or just indicating me some documentation where I can find the answers, or a better understanding of this authentication feature ? Authentication is pretty complicated for me, always has been 🥲. Any help is very appreciated !

Use Identity to secure a Web API backend for SPAs

Learn how to use Identity to secure a Web API backend for single page applications (SPAs).

MDN Web Docs

Using the Fetch API - Web APIs | MDN

The Fetch API provides a JavaScript interface for making HTTP requests and processing the responses.

6 Replies

FilomeonOP•4w ago

Ok, so I found that using this

builder.Services.ConfigureApplicationCookie(options =>
{
    options.Cookie.SameSite = SameSiteMode.None;
    options.Cookie.SecurePolicy = CookieSecurePolicy.Always;
});

builder.Services.ConfigureApplicationCookie(options =>
{
    options.Cookie.SameSite = SameSiteMode.None;
    options.Cookie.SecurePolicy = CookieSecurePolicy.Always;
});

it works but I m not sure if its considered safe and secure .. ? 🤔 with "CSRF" attacks for example, idk

Sossenbinder•4w ago

I'd always favor cookies if possible Way less hassle What do the domains of your frontend and backend look like?

Unknown User•4w ago

Message Not Public

FilomeonOP•3w ago

they both are localhost, for now haha... Angular is default http://localhost:4200/ and Api is default https://localhost:7216. I just realized right now that my default Angular is not HTTPS, that could be a problem too... I have no idea, sorry i dont know a lot about security, I just found this in a google result 😅 You mean, maybe I used a cookie configuration but not the good one (the one supposed to work for Identity) ? I need to look at that, that was the ConfigurateApplication that I found with Copilot so it may be totally wrong 😁 Can I do that at the stade of development ? And, is localhost not already considered the same domain, when only the port seems to differ ? I think I need to know a lot more about these deployment topics and cookie authentication methods 😅 I will search more documentation about these, I feel like its totally out of my comprehension, maybe I need more theory first ? I m looking for a proxy solution right now ^^ I m thinking about something, I am sorry if that ping bothers you, tell me if it does... @TeBeCo @Sossenbinder I have a question for you guys, because I m kind of little bit tired of doing localhost development. What do you think about this : I would start a free trial with Azure cloud, and I would host the most basic weatherforecast app (Angular client and ASP.NET API server), just to see how these apps communicate in a real world scenario. With zero authentication at first. Then I would build up from there, and add feature by feature. Do you think this could be a good idea ? Or you may think that, since I struggled to even make it work in localhost, it would be a bad idea to try it in the cloud ? Or : since I would host the client and the server on the same domain, maybe it would be easier though ?

Sossenbinder•3w ago

Sorry, I just get to read it now, will catch up later when I'm off work A proxy is a good idea imo Angular should come with a proxy by default That way your local spa client can just use relative paths Because if you think about it, I think there's a 99% chance your client and your server will be hosted on the same "real" domain later So I'd focus on reproducing that setup on your machine as well, otherwise you're building workarounds for local in your app and you suddenly might run into issues with your workarounds once your app is on the real domain setup I've seen that before

FilomeonOP•3w ago

Ok I see, thank you very much I will start setting up this proxy tomorrow, I have a lot to learn about these things. Thanks for the help 👍

Gaming

Programming

Identity, .NET Api and Angular client

Did you find this page helpful?