web-dev-qa-db-ja.com

angularでasp.netコアWeb APIのasp.net Identity UIを変更する方法

数日前に.netコアの学習を開始し、最初に、組み込みのangular 8テンプレートを使用して.netcoreプロジェクトを作成しました。

カウンターやデータのフェッチなど、いくつかの角度のあるページが組み込まれていますが、Identity関連のすべてのページ（ログイン、登録など）は、バックエンドからプレーンHTMLとして送信されます。したがって、「私の主な懸念は、そのページのUIを変更することです」.

IDがクラスライブラリに追加されているため、バックエンドコードに表示されないことがわかりました。それに変更を加えるには、まず足場で再生成してコードに追加する必要があります。これにより、以前のライブラリコードが上書きされ、必要に応じて変更できます。

そこで、新しい足場アイテムの追加-> IDを選択しました。そして、最初の試行で「すべてのファイルを上書き」を選択し、2回目の試行でのみ「account\login」と「account\register」を選択し、dbcontextにはapplicationdbcontextを選択しました。残念ながらどちらもうまくいきませんでした。

コードをビルドしようとすると、このエラーが発生します

Error   CS0246  The type or namespace name 'IWebHostEnvironment' could not be found (are you missing a using directive or an Assembly reference?)   

C:\Users\MyUserName\source\repos\MyProjectName\obj\Debug\netcoreapp3.0\Razor\Pages\Shared\_Layout.cshtml.g.cs   448

.g.cs拡張子が何であるか本当にわかりません。そのページにはインポート文がなく、これまで見たことのない奇妙なコードがいくつかあります。ページ自体にもエラー/赤いマークは表示されません。

ここで基本的に2つのことを達成したいのですが、

1）.netコアアプリを完全にAPIとして使用し、バックエンドからHTMLとして取得するのではなく、angular自体にすべてのログイン関連のもののUIを構築したいと考えています。

2）ユーザーログインフォームにいくつかのフィールドを追加します。そして、それはコードファーストアプローチなので、最終的にユーザーDBSetに変更を加えます（この場合、私はこれを行う方法がわかりません）。

コードサンプルは一種の簡単な問題/質問であるため、追加していません。問題を再現するには、.net core 3.0でプロジェクトを作成し、angular 8テンプレートを使用します。ログインまたは登録ページで、UI関連の変更を行ってください。

asp.net-core-webapiidentityserver4angular8asp.net-core-3.0
4
Mohammed Khan

https://devblogs.Microsoft.com/aspnet/aspnetcore-2-1-identity-ui/ のガイドを確認するだけで、新しいコア3 angular 8テンプレートプロジェクトにも適用されますAngular認証もサポートしています。

少し異なる点の1つは、Areas.Identity.Pages.Account.Manage.Index.cshtml.csファイルのpublic async Task OnPostAsync（）メソッドで、そのプロファイルでユーザー名の更新をサポートするためのものです。

したがって、足場テンプレートを以下のサンプルと比較すると、以前の単純な単一のSetPhoneNumberAsync呼び出しの代わりにUpdateAsyncを使用するのに役立ちます。

if (Input.PhoneNumber != phoneNumber || Input.Name != user.FullName)
{
    user.FullName = Input.Name;
    user.PhoneNumber = Input.PhoneNumber;

    var updateProfileResult = await _userManager.UpdateAsync(user);
    if (!updateProfileResult.Succeeded)
    {
        throw new InvalidOperationException($"Unexpected error ocurred updating the profile for user with ID '{user.Id}'");
    }
}
0
Iman Abidi