AddApiAuthorization with Angular login/register pages instead of MVC views

Question

User-375835195 posted

I'm using the following scaffolded example with angular and ASP.NET Identity with IdentityServer4.

dotnet new angular -o <output_directory_name> -au Individual

The implementation is amazing, because it uses the recommended code with PKCE with angular OIDC client, which I tried to do myself, but it's way more code and it doesn't look as good as Microsoft's.

I want to use angular login/register pages instead of the default MVC views. Is that possible? I'm aware that what they did is also a separate part of the project, but I still want to use angular views. My angular and ASP.NET Core projects are completely separate and I don't use services.AddSpaStaticFiles which optimizes angular and starts angular at same port with the ASP.NET Core.

Answer 1

User711641945 posted

Hi Hulkstance,

I want to use angular login/register pages instead of the default MVC views. Is that possible?

For Asp.Net Core Angualr template with Identity, it is combined with Angular View and Identity Library which is razor view. This is by design.

For Identity, it is developed with Identity Library which is Razor Library.

While clicking the Login link from Angular login-menu.component.html, it redirect the page to login page in Identity library.

You need to override the pages in Identity Library to change the login page.

Best Regards,

Rena

Answer 2

User-474980206 posted

even though you are using individual identity on the core app, as you noticed, the SPA code uses oauth client code, and jwt tokens rather than a cookie.  

if you will not need oauth support, you can easily create a login method that returns a jwt token, and a user manager for this token.

note: you can use the 2.1 template to generate most of the code you need.

Answer 3

User-375835195 posted

Rena Ni

Hi Hulkstance,

Hulkstance

I want to use angular login/register pages instead of the default MVC views. Is that possible?

For Asp.Net Core Angualr template with Identity, it is combined with Angular View and Identity Library which is razor view. This is by design.

For Identity, it is developed with Identity Library which is Razor Library.

While clicking the Login link from Angular login-menu.component.html, it redirect the page to login page in Identity library.

You need to override the pages in Identity Library to change the login page.

Best Regards,

Rena

That's right. I checked the implementation. https://github.com/dotnet/aspnetcore/blob/master/src/Identity/ApiAuthorization.IdentityServer/src/Options/ClientBuilder.cs

What did you mean by just override the pages?

options.UserInteraction.LoginUrl option from the original IdentityServer4 package? It was ignored in the latest releases as far as I know.

bruce (sqlwork.com)

even though you are using individual identity on the core app, as you noticed, the SPA code uses oauth client code, and jwt tokens rather than a cookie.  

if you will not need oauth support, you can easily create a login method that returns a jwt token, and a user manager for this token.

note: you can use the 2.1 template to generate most of the code you need.

Not sure what you meant by that, but I don't want to use resource owner flow because it's insecure and not recommended anymore. I wanted to use code with PKCE.