From 4689f4835aa093733fd53a9729a71b68dc8f817a Mon Sep 17 00:00:00 2001 From: Galip Tolga Erdem Date: Sat, 28 Mar 2020 07:29:14 +0300 Subject: [PATCH 1/3] added post --- docs/en/Blog-Posts/2020-04-03/Post.md | 122 ++++++++++++++++++++++++++ 1 file changed, 122 insertions(+) create mode 100644 docs/en/Blog-Posts/2020-04-03/Post.md diff --git a/docs/en/Blog-Posts/2020-04-03/Post.md b/docs/en/Blog-Posts/2020-04-03/Post.md new file mode 100644 index 0000000000..3ac5d212c2 --- /dev/null +++ b/docs/en/Blog-Posts/2020-04-03/Post.md @@ -0,0 +1,122 @@ +# Custom Login PageModel in **ABP** ASP.NET Core MVC application + +ABP Framework uses Microsoft Identity underneath hence supports customization as much as Microsoft Identity does. + +### Creating Login PageModel + +To create your own custom Login PageModel, you need to inherit [Abp LoginModel](https://github.com/abpframework/abp/blob/037ef9abe024c03c1f89ab6c933710bcfe3f5c93/modules/account/src/Volo.Abp.Account.Web/Pages/Account/Login.cshtml.cs). + +````xml +public class CustomLoginModel : LoginModel +{ + public CustomLoginModel( + Microsoft.AspNetCore.Authentication.IAuthenticationSchemeProvider schemeProvider, + Microsoft.Extensions.Options.IOptions accountOptions) + : base(schemeProvider, accountOptions) + { + } +} +```` + +### Overriding Methods + +Afterwards you can override a method like `CreateExternalUserAsync`: + +````xml +protected override async Task CreateExternalUserAsync(ExternalLoginInfo info) +{ + var emailAddress = info.Principal.FindFirstValue(AbpClaimTypes.Email); + + var user = new IdentityUser(GuidGenerator.Create(), emailAddress, emailAddress, CurrentTenant.Id); + + CheckIdentityErrors(await UserManager.CreateAsync(user)); + CheckIdentityErrors(await UserManager.SetEmailAsync(user, emailAddress)); + CheckIdentityErrors(await UserManager.AddLoginAsync(user, info)); + + return user; +} +```` + +### Overriding Login Page UI + +Overriding `.cshtml` files can be easily done via [Virtual File System](https://docs.abp.io/en/abp/latest/Virtual-File-System). Create folder named **Account** under **Pages** directory. Create **Login.cshtml** under Pages/Account directory. + +Set the model with your newly created Login Page Model and customize to your preferences like: + +````xml +@page +@using Volo.Abp.Account.Settings +@using Volo.Abp.Settings +@model Acme.BookStore.Web.CustomLoginModel +@inherits Volo.Abp.Account.Web.Pages.Account.AccountPage +@inject Volo.Abp.Settings.ISettingProvider SettingProvider + +
+

My Customized Login Page!

+
+@if (Model.EnableLocalLogin) +{ +
+
+

@L["Login"]

+ @if (await SettingProvider.IsTrueAsync(AccountSettingNames.IsSelfRegistrationEnabled)) + { + + @L["AreYouANewUser"] + @L["Register"] + + } +
+ + +
+ + + +
+
+ + + +
+
+ +
+ @L["Login"] +
+
+ +
+ @L["Cancel"] @* TODO: Only show if identity server is used *@ +
+
+} + +@if (Model.VisibleExternalProviders.Any()) +{ +
+

@L["UseAnotherServiceToLogIn"]

+
+ + + @foreach (var provider in Model.VisibleExternalProviders) + { + + } +
+
+} + +@if (!Model.EnableLocalLogin && !Model.VisibleExternalProviders.Any()) +{ +
+ @L["InvalidLoginRequest"] + @L["ThereAreNoLoginSchemesConfiguredForThisClient"] +
+} +```` + +Further readings, [ASP.NET Core (MVC / Razor Pages) User Interface Customization Guide](https://docs.abp.io/en/abp/latest/UI/AspNetCore/Customization-User-Interface#asp-net-core-mvc-razor-pages-user-interface-customization-guide). \ No newline at end of file From 2867cc34f9e8de7c57827a0765a38773649e5c79 Mon Sep 17 00:00:00 2001 From: Galip Tolga Erdem Date: Sat, 28 Mar 2020 16:14:26 +0300 Subject: [PATCH 2/3] updated headers and added sample link --- docs/en/Blog-Posts/2020-04-03/Post.md | 20 +++++++++++++++++--- 1 file changed, 17 insertions(+), 3 deletions(-) diff --git a/docs/en/Blog-Posts/2020-04-03/Post.md b/docs/en/Blog-Posts/2020-04-03/Post.md index 3ac5d212c2..7ee3c8b1ed 100644 --- a/docs/en/Blog-Posts/2020-04-03/Post.md +++ b/docs/en/Blog-Posts/2020-04-03/Post.md @@ -1,8 +1,18 @@ # Custom Login PageModel in **ABP** ASP.NET Core MVC application +## Introduction + ABP Framework uses Microsoft Identity underneath hence supports customization as much as Microsoft Identity does. -### Creating Login PageModel + + +## Sample Code + +https://github.com/abpframework/abp-samples/tree/master/aspnet-core/BookStore-AzureAD + + + +## Creating Login PageModel To create your own custom Login PageModel, you need to inherit [Abp LoginModel](https://github.com/abpframework/abp/blob/037ef9abe024c03c1f89ab6c933710bcfe3f5c93/modules/account/src/Volo.Abp.Account.Web/Pages/Account/Login.cshtml.cs). @@ -18,7 +28,9 @@ public class CustomLoginModel : LoginModel } ```` -### Overriding Methods + + +## Overriding Methods Afterwards you can override a method like `CreateExternalUserAsync`: @@ -37,7 +49,9 @@ protected override async Task CreateExternalUser } ```` -### Overriding Login Page UI + + +## Overriding Login Page UI Overriding `.cshtml` files can be easily done via [Virtual File System](https://docs.abp.io/en/abp/latest/Virtual-File-System). Create folder named **Account** under **Pages** directory. Create **Login.cshtml** under Pages/Account directory. From 4b5cb6a96937ecc7b71eb3e891924176f918a8e7 Mon Sep 17 00:00:00 2001 From: Galip Tolga Erdem Date: Sat, 28 Mar 2020 16:18:30 +0300 Subject: [PATCH 3/3] udpated link --- docs/en/Blog-Posts/2020-04-03/Post.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/en/Blog-Posts/2020-04-03/Post.md b/docs/en/Blog-Posts/2020-04-03/Post.md index 7ee3c8b1ed..a95eb6c873 100644 --- a/docs/en/Blog-Posts/2020-04-03/Post.md +++ b/docs/en/Blog-Posts/2020-04-03/Post.md @@ -8,7 +8,7 @@ ABP Framework uses Microsoft Identity underneath hence supports customization as ## Sample Code -https://github.com/abpframework/abp-samples/tree/master/aspnet-core/BookStore-AzureAD +https://github.com/abpframework/abp-samples/blob/master/aspnet-core/BookStore-AzureAD/src/Acme.BookStore.Web/Pages/CustomLoginModel.cs