What purpose does an Area serve?
An area is like a department of your web project. It is an independent unit.
Consider a website portal of a college where students login and download their assignments and time table. And, the teachers use the same portal to upload that content.
This website has two independent functionalities? - one for the students, and the other for the faculty.
This project can be programmed better, and maintained better, if related files are tied into two separate logical units? That will help two different teams to work independently.
ASP.NET Core helps achieve this partition with the help of the concept of areas. This portal can have an area called, say, Student and another called Teacher. Razor pages of students can live in the Student area, and of the teachers in the Teacher area.
How is an Area Implemented?
(see the linked video for details)
Step 1: Create a folder called Areas
directly in the root directory of your project. The name is hardcoded in ASP.NET Core; so the spellings matter.
Step 2: To create an area called Student
, create a sub-folder called Student directly inside the Areas
folder.
Step 3: To create another area called Teacher
, create a sub-folder called Teacher directly inside the Areas
folder, so that the folders "Teacher" and "Student" are parallel to each other, and both are immediate sub-folders of the "Areas" folder.
Step 4: Each area has its own folder structure starting with the "Pages" folder. So the "Teacher" folder will now contain a sub-folder called "Pages", and all the razor pages of the "Teacher" functionality will live there - as an independent logical unit. Likewise for other areas.
Video Explanation with a Working Example
Please watch the following youtube video:
What about Routing?
(see the linked video for details)
If you are using razor pages, then ASP.NET Core handles it for you. No special code for configuration of routing needs to be written.
The following request will automatically be routed to the index page of the "Teacher" area:
localhost:xxxx/Teacher/
And the following will automatically be routed to the index page of the "Student" area:
localhost:xxxx/Student/
How will anchor links navigate?
(see the linked video for details)
If you are using razor pages, then you can use tag helpers to easily create links for pages inside areas. With tag helpers you have to specify the asp-area
attribute as below. The anchor link shown below will point to the index page of the "Products" area:
<a asp-area="Products" asp-page="Index"> Products - Index </a>
A Practical Authorization Scheme
A website portal will usually consist of a common login form.
When a user authenticates, he is taken to his Area
, according as his associated role. A teacher is moved to the "Teacher" area, and student to the "Student" area.
An authorization scheme is put in place so that user's only of a specific role can view the pages of a specific area.
In the ConfigureServices method authorization policies are first defined, and then applied to the entire "Teacher" area so that only the users with the Admin role can access the pages.
public void ConfigureServices(IServiceCollection services) { services.AddAuthorization(opt => { opt.AddPolicy("PTeacher", policy => { policy.RequireRole("Admin"); }); }); // add support for razor pages services.AddRazorPages(opt => { // all folders in the Teacher area, need a policy // PTeacher, i.e., Admin role opt.Conventions.AuthorizeAreaFolder("Teacher", "/", "PTeacher"); }); } // please note middleware must be // configured for Authorization and Authentication // that code is not shown here
This Blog Post/Article "(C# ASP.NET Core) Concept of Areas and an Authorization Scheme" by Parveen is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License.