ASP. NET Zero -- front-end application, asp. netzero -- front-end

ASP. NET Zero -- front-end application, asp. netzero -- front-end
Front-end applications

ASP. NET Zero contains front-end pages that can serve as the starting point for your public website or application landing page. When running the project for the first time, you will see the home page as follows:

There are two pages: home page and about. The content of these pages is only a placeholder and demonstration purpose. You can delete the content and build the page as needed. In addition, you should change the logo with your company logo.

See metronic front-end topics to build a richer website for all possibilities and components.

The menu is defined in the FrontEndNavigationProvider class. When you add a new menu item here, it is automatically displayed in the menu. There is a logon link in the upper right corner. This link enables us to enter the logon page to enter the backend application.

Layout

The layout of the front-end page is located under the "View/layout" folder of the. Web project:

_ Layout is the main Layout file that contains scripts and styles. The language flag and menu are displayed in the title component under the shared/component. _ PreFooter is not used, but you can add it to _ Layout if needed.

Tenant Registration

When you click the "new tenant" link in the front-end application, you can register as a new tenant:

Here, you can create a new tenant. The TenantRegistration controller is used to register a new tenant. You can enable/disable tenant registration and modify some settings on the settings page of the backend application.

Account Controller

AccountController provides the logon, registration, and password and email activation pages.

Layout

The Account Management page has a separated _ Layout View under the Views/accounts folder:

Related scripts and style resources in the view-resources/Views/Account Folder:

Similarly, all views of an application have corresponding styles and script files in the wwwroot/view-resources folder.

Login

The main view of AccountController is the "Logon" Page:

The tenant selection section at the top of the logon section is only displayed in Multi-tenant applications, and "subdomain name leasing account name detection" is unavailable (see host Settings section ). When you click the change link, the tenant change dialog box is displayed. You can change the tenant. There is a tenant named Default in the initial database (see the Entity Framework section of the initial seed data ). Leave the tenant name blank and log on with the host.

We can use the admin user name and 123qwe password to run the application. First, we should change the administrator password after logging on, because 123qwe is not very secure:

After changing the password, we will redirect to the backend application.

Social Login

ASP. NET Zero supports social media login. To enable it, we should change the following settings to set a ppsettings. json file.

  “Authentication”：{       “Facebook”：{       “IsEnabled”：“false”，       “AppId”：“”，       “AppSecret”：“”    }，    “Google”：{       “IsEnabled”：“false”，       “ClientId”：“”，       “ClientSecret”：“”    }，    “Twitter”：{       “IsEnabled”：“false”，       “ConsumerKey”：“”，       “ConsumerSecret”：“”    }，    “Microsoft”：{       “IsEnabled”：“false”，       “ConsumerKey”：“”，       “ConsumerSecret”：“”    }  }，

You can find many documents on the Internet to learn how to get the authentication key for social platforms. Therefore, we will not detail how to create an application on social media. Once you get your keys, you can write them into etettings. json. After it is enabled, the social media logo is automatically displayed on the logon page, as shown below:

OPENID connection Logon

In addition to social Login, ASP. NET Zero also includes OpenId Connect Login integration. Its configuration can be changed in appsettings. json:

“OpenId”：{   “IsEnabled”：“false”，   “Authority”：“”，   “ClientId”：“”，   “ClientSecret”：“” }

When enabled, the logon page displays a logo (similar to the above social logo ).

Two-factor Login

ASP. NET Zero can be used for two-factor logon, but is disabled by default. You can easily enable it on the host settings page (Security Tab:

Note: In multi-tenant applications, dual authentication is enabled only in host settings. In addition, email and SMS verification settings are only available on the host. This is only a design.

After enabling, enter the user name and password, the system will ask the user to select the authentication method:

Then, the confirmation code is sent to the selected provider. The user enters the code on the next page:

Email Verification

If the user has a confirmed email address, it is available. Because email sending is disabled in debug mode, you can view the code in the log. In release mode, the email will be sent (you can change this information and make it available for debugging, see the send email section ).

Text message Verification

If you have a confirmed phone number, you can use this function. SMS sending is not actually implemented (because it needs to be integrated with the SMS supplier ). The current implementation only writes the security code into the log. You should complete the identitysmessageservice class in the solution to make it available. Otherwise, disable text message verification in settings.

User lock

As described in the previous section, you can configure user lock settings. The user is locked when the wrong password is entered for the specified count and duration.

Register

When we click the "Create account" link on the logon page, a Registry ticket is displayed:

You can register a tenant, not a Host, if this is a multi-tenant application. For a single tenant, no tenant name exists.

Recaptcha is optional. It uses Google's recaptcha service. Recaptcha service for each domain name. Therefore, in order to make it work properly, you should create a private and public key in the domain on https://www.google.com/recaptchaand Replace the key in the appsettings. json file.

Email Activation

When the user registers as shown above, the email confirmation code will be sent to his email address. If you have not received this email for some reason, you can click the email to activate it and resend the confirmation code.

Once again, the tenant name is not displayed as a single-tenant application, or the tenant name is known through a subdomain name (such as tenancyname.mydomain.com.

Forgot password

If the user forgets his or her password, he can click the "forgot password" link to obtain the email Reset Password.