Using SO article to scaffold Identity for react Web project doesn't work

377 views Asked by At

I am following this SO article to scaffold Identity. modify sign/login UI for oidc-client with .net core react template

I am using the front-end code made by another developer and need to generate the mid-layer code to connect his login and home pages to controller methods.

The link is an answer for EF Core 3.1, we’re on 6.0. The link example is made from scratch, for us a .Net Core 6.0 React Template is already in play.

The client folder on the repo was copied down to the project. The default client app folder was removed and the downloaded client renamed to ClientApp.

This builds fine, the login screen wired to mock data comes right up.

Need to scaffold in Identity to wire up to the DB.

Step 5: “Run the Identity scaffolder with the options you want , use --files to scaffold specific files ,use the correct fully qualified name for your DB context: dotnet aspnet-codegenerator identity -dc ProjectName.Data.ApplicationDbContext --files "Account.Register;Account.Login" If you run the Identity scaffolder without specifying the --files flag or the --useDefaultUI flag, all the available Identity UI pages will be created in your project.”

I am running this at the CLI at the ClientApp folder: dotnet aspnet-codegenerator identity -dc LpaAdmin.EFCore.Models.LpaAdminContext --files "Account.Login"

LpaAdmin.EFCore.Models.LpaAdminContext is the fully qualified name to the Db Context. The project in which it lives is referenced in the LPAAdmin.Web under Projects.

There is already a login page, my thinking is I'll still need the scaffolding to get the code to connect to controllers. A login.cshmtl will no doubt be made, but we will be wiring up the Login.tsx page. So will just remove the created .cshtml page.

The CLI command runs but nothing is being installed. Here is what I get:

dotnet aspnet-codegenerator identity -dc LpaAdmin.EFCore.Models.LpaAdminContext --files "Account.Login" Building project ... Finding the generator 'identity'... Running the generator 'identity'... Install the following packages to your project for scaffolding identity: Microsoft.AspNetCore.Identity.UI,Microsoft.EntityFrameworkCore.Design at Microsoft.VisualStudio.Web.CodeGeneration.ActionInvoker.b__6_0() at Microsoft.Extensions.CommandLineUtils.CommandLineApplication.Execute(String[] args) at Microsoft.VisualStudio.Web.CodeGeneration.ActionInvoker.Execute(String[] args) at Microsoft.VisualStudio.Web.CodeGeneration.CodeGenCommand.Execute(String[] args) RunTime 00:00:19.09

Looking for a quick and easy React tutorial, no joy. The steps above are clear enough, just missing something easy.

Summarizing:

The project created from Visual Studio Template for react builds, there are no errors.

The login.tsx page runs up and runs against mock data

Need to scaffold in Identity and connect via the existing fully qualified Db Context and if these steps are correct, this should work.
Again, the link above does start from scratch at step one using CLI to make a React project with Individual Auth.
Also, it’s an answer for EF Core 3.1, we’re on 6.0. That's a lot of detail -- it must be a simple CLI syntax thing. Thanks for any help.

2

There are 2 answers

0
Christopher Uduekwe On

Sorry there's no solution to this till date as Microsoft did not release any documentation on this. Kindly avoid using the dotnetcore webapp-react template in VS. Simply create a seperate dotnet core API project and react application.

0
ace.spades On

Been having the same issue with api react template and was also having trouble finding a good resource to this issue. Fortunately I seem to have solved the issue.

This is how it worked for me using .Net core(6) api react template

  • Update all nuget packages right after creation of new project. This should eliminate the errors running the scaffolding.
  • Run the scaffold identity
  • Add a new data context, then select it from the dropdown
  • Add a new user class, then select it from the dropdown, Then click Add (This step is important as the scaffolding will use the user class here to build the pages. If you don't select any user class from the dropdown, it will use the default IdentityUser)
  • New db conn string will be added in config. Replace with your localdb config
  • In the Program.cs change the data context in AddDbContext<WithYourNewContext>
  • Change AddDefaultIdentity<WithYourNewUserClass>
  • Change AddApiAuthorization<WithYourNewUserClass,WithYourNewContext>
  • This page might cause an error (\Pages\Shared_LoginPartial.cshtml). So you might want to update the dependency injection on that page as well.

May be later on you can try to replace the context and user class when you have a working prototype in the end. Hope this helps.