36 |
38 | 
13 |
--------------------------------------------------------------------------------
/AuthECClient/src/app/directives/hide-if-claims-not-met.directive.ts:
--------------------------------------------------------------------------------
1 | import { Directive, ElementRef, Input, OnInit } from '@angular/core';
2 | import { AuthService } from '../shared/services/auth.service';
3 |
4 | @Directive({
5 | selector: '[appHideIfClaimsNotMet]',
6 | standalone: true
7 | })
8 | export class HideIfClaimsNotMetDirective implements OnInit {
9 | @Input("appHideIfClaimsNotMet") claimReq!: Function;
10 |
11 | constructor(private authService: AuthService,
12 | private elementRef: ElementRef) { }
13 |
14 | ngOnInit(): void {
15 | const claims = this.authService.getClaims();
16 |
17 | if (!this.claimReq(claims))
18 | this.elementRef.nativeElement.style.display = "none";
19 | }
20 |
21 | }
22 |
--------------------------------------------------------------------------------
/AuthECAPI/AuthECAPI/obj/Debug/net8.0/AuthECAPI.MvcApplicationPartsAssemblyInfo.cs:
--------------------------------------------------------------------------------
1 | //------------------------------------------------------------------------------
2 | //
2 |
--------------------------------------------------------------------------------
/AuthECClient/src/app/layouts/main-layout/main-layout.component.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 | import { Router, RouterLink, RouterOutlet } from '@angular/router';
3 | import { AuthService } from '../../shared/services/auth.service';
4 | import { HideIfClaimsNotMetDirective } from '../../directives/hide-if-claims-not-met.directive';
5 | import { claimReq } from "../../shared/utils/claimReq-utils";
6 |
7 | @Component({
8 | selector: 'app-main-layout',
9 | standalone: true,
10 | imports: [RouterOutlet, RouterLink, HideIfClaimsNotMetDirective],
11 | templateUrl: './main-layout.component.html',
12 | styles: ``
13 | })
14 | export class MainLayoutComponent {
15 | constructor(private router: Router,
16 | private authService: AuthService) { }
17 |
18 | claimReq = claimReq
19 |
20 | onLogout() {
21 | this.authService.deleteToken();
22 | this.router.navigateByUrl('/signin');
23 | }
24 | }
25 |
--------------------------------------------------------------------------------
/AuthECAPI/AuthECAPI/Properties/launchSettings.json:
--------------------------------------------------------------------------------
1 | {
2 | "$schema": "http://json.schemastore.org/launchsettings.json",
3 | "iisSettings": {
4 | "windowsAuthentication": false,
5 | "anonymousAuthentication": true,
6 | "iisExpress": {
7 | "applicationUrl": "http://localhost:29535",
8 | "sslPort": 0
9 | }
10 | },
11 | "profiles": {
12 | "http": {
13 | "commandName": "Project",
14 | "dotnetRunMessages": true,
15 | "launchBrowser": true,
16 | "launchUrl": "swagger",
17 | "applicationUrl": "http://localhost:5007",
18 | "environmentVariables": {
19 | "ASPNETCORE_ENVIRONMENT": "Development"
20 | }
21 | },
22 | "IIS Express": {
23 | "commandName": "IISExpress",
24 | "launchBrowser": true,
25 | "launchUrl": "swagger",
26 | "environmentVariables": {
27 | "ASPNETCORE_ENVIRONMENT": "Development"
28 | }
29 | }
30 | }
31 | }
32 |
--------------------------------------------------------------------------------
/AuthECAPI/AuthECAPI/AuthECAPI.csproj:
--------------------------------------------------------------------------------
1 |
3 |
20 |
4 |
18 |
19 |
5 |
17 |
6 |
11 |
7 | 
8 |
10 |
8 | Auth EC
9 |
12 |
16 |
13 |
15 |
2 |
9 |
--------------------------------------------------------------------------------
/AuthECClient/.vscode/tasks.json:
--------------------------------------------------------------------------------
1 | {
2 | // For more information, visit: https://go.microsoft.com/fwlink/?LinkId=733558
3 | "version": "2.0.0",
4 | "tasks": [
5 | {
6 | "type": "npm",
7 | "script": "start",
8 | "isBackground": true,
9 | "problemMatcher": {
10 | "owner": "typescript",
11 | "pattern": "$tsc",
12 | "background": {
13 | "activeOnStart": true,
14 | "beginsPattern": {
15 | "regexp": "(.*?)"
16 | },
17 | "endsPattern": {
18 | "regexp": "bundle generation complete"
19 | }
20 | }
21 | }
22 | },
23 | {
24 | "type": "npm",
25 | "script": "test",
26 | "isBackground": true,
27 | "problemMatcher": {
28 | "owner": "typescript",
29 | "pattern": "$tsc",
30 | "background": {
31 | "activeOnStart": true,
32 | "beginsPattern": {
33 | "regexp": "(.*?)"
34 | },
35 | "endsPattern": {
36 | "regexp": "bundle generation complete"
37 | }
38 | }
39 | }
40 | }
41 | ]
42 | }
43 |
--------------------------------------------------------------------------------
/AuthECClient/src/app/dashboard/dashboard.component.ts:
--------------------------------------------------------------------------------
1 | import { Component, OnInit } from '@angular/core';
2 | import { Router } from '@angular/router';
3 | import { AuthService } from '../shared/services/auth.service';
4 | import { UserService } from '../shared/services/user.service';
5 | import { HideIfClaimsNotMetDirective } from '../directives/hide-if-claims-not-met.directive';
6 | import { claimReq } from '../shared/utils/claimReq-utils';
7 |
8 | @Component({
9 | selector: 'app-dashboard',
10 | standalone: true,
11 | imports: [HideIfClaimsNotMetDirective],
12 | templateUrl: './dashboard.component.html',
13 | styles: ``
14 | })
15 | export class DashboardComponent implements OnInit {
16 |
17 | constructor(private router: Router,
18 | private authService: AuthService,
19 | private userService: UserService) { }
20 | fullName: string = ''
21 | claimReq = claimReq
22 |
23 | ngOnInit(): void {
24 | this.userService.getUserProfile().subscribe({
25 | next: (res: any) => this.fullName = res.fullName,
26 | error: (err: any) => console.log('error while retrieving user profile:\n', err)
27 | })
28 | }
29 |
30 |
31 | }
32 |
--------------------------------------------------------------------------------
/AuthECClient/tsconfig.json:
--------------------------------------------------------------------------------
1 | /* To learn more about Typescript configuration file: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html. */
2 | /* To learn more about Angular compiler options: https://angular.dev/reference/configs/angular-compiler-options. */
3 | {
4 | "compileOnSave": false,
5 | "compilerOptions": {
6 | "outDir": "./dist/out-tsc",
7 | "strict": true,
8 | "noImplicitOverride": true,
9 | "noPropertyAccessFromIndexSignature": true,
10 | "noImplicitReturns": true,
11 | "noFallthroughCasesInSwitch": true,
12 | "skipLibCheck": true,
13 | "esModuleInterop": true,
14 | "sourceMap": true,
15 | "declaration": false,
16 | "experimentalDecorators": true,
17 | "moduleResolution": "bundler",
18 | "importHelpers": true,
19 | "target": "ES2022",
20 | "module": "ES2022",
21 | "useDefineForClassFields": false,
22 | "lib": [
23 | "ES2022",
24 | "dom"
25 | ]
26 | },
27 | "angularCompilerOptions": {
28 | "enableI18nLegacyMessageIdFormat": false,
29 | "strictInjectionParameters": true,
30 | "strictInputAccessModifiers": true,
31 | "strictTemplates": true
32 | }
33 | }
34 |
--------------------------------------------------------------------------------
/AuthECAPI/AuthECAPI/Controllers/AuthorizationDemoEndpoints.cs:
--------------------------------------------------------------------------------
1 | using Microsoft.AspNetCore.Authorization;
2 |
3 | namespace AuthECAPI.Controllers
4 | {
5 | public static class AuthorizationDemoEndpoints
6 | {
7 |
8 | public static IEndpointRouteBuilder MapAuthorizationDemoEndpoints(this IEndpointRouteBuilder app)
9 | {
10 | app.MapGet("/AdminOnly", AdminOnly);
11 |
12 |
13 | app.MapGet("/AdminOrTeacher", [Authorize(Roles = "Admin,Teacher")] ()=>
14 | { return "Admin Or Teacher"; });
15 |
16 | app.MapGet("/LibraryMembersOnly", [Authorize(Policy = "HasLibraryId")] () =>
17 | { return "Library members only"; });
18 |
19 | app.MapGet("/ApplyForMaternityLeave", [Authorize(Roles = "Teacher", Policy = "FemalesOnly")] () =>
20 | { return "Applied for maternity leave."; });
21 |
22 | app.MapGet("/Under10sAndFemale",
23 | [Authorize(Policy = "Under10")]
24 | [Authorize(Policy = "FemalesOnly")] () =>
25 | { return "Under 10 And Female"; });
26 |
27 | return app;
28 | }
29 |
30 | [Authorize(Roles ="Admin")]
31 | private static string AdminOnly()
32 | { return "Admin Only"; }
33 | }
34 | }
35 |
--------------------------------------------------------------------------------
/AuthECClient/README.md:
--------------------------------------------------------------------------------
1 | # AuthECClient
2 |
3 | This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 18.0.7.
4 |
5 | ## Development server
6 |
7 | Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The application will automatically reload if you change any of the source files.
8 |
9 | ## Code scaffolding
10 |
11 | Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module`.
12 |
13 | ## Build
14 |
15 | Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory.
16 |
17 | ## Running unit tests
18 |
19 | Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io).
20 |
21 | ## Running end-to-end tests
22 |
23 | Run `ng e2e` to execute the end-to-end tests via a platform of your choice. To use this command, you need to first add a package that implements end-to-end testing capabilities.
24 |
25 | ## Further help
26 |
27 | To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI Overview and Command Reference](https://angular.dev/tools/cli) page.
28 |
--------------------------------------------------------------------------------
/AuthECAPI/AuthECAPI/obj/Debug/net8.0/AuthECAPI.GeneratedMSBuildEditorConfig.editorconfig:
--------------------------------------------------------------------------------
1 | is_global = true
2 | build_property.TargetFramework = net8.0
3 | build_property.TargetPlatformMinVersion =
4 | build_property.UsingMicrosoftNETSdkWeb = true
5 | build_property.ProjectTypeGuids =
6 | build_property.InvariantGlobalization =
7 | build_property.PlatformNeutralAssembly =
8 | build_property.EnforceExtendedAnalyzerRules =
9 | build_property._SupportedPlatformList = Linux,macOS,Windows
10 | build_property.RootNamespace = AuthECAPI
11 | build_property.RootNamespace = AuthECAPI
12 | build_property.ProjectDir = D:\YouTube\Videos\Angular\Angular 18\Angular Authorization (Role, Claim & Policy) with .Net Core API\Project\AuthECAPI\AuthECAPI\
13 | build_property.EnableComHosting =
14 | build_property.EnableGeneratedComInterfaceComImportInterop =
15 | build_property.RazorLangVersion = 8.0
16 | build_property.SupportLocalizedComponentNames =
17 | build_property.GenerateRazorMetadataSourceChecksumAttributes =
18 | build_property.MSBuildProjectDirectory = D:\YouTube\Videos\Angular\Angular 18\Angular Authorization (Role, Claim & Policy) with .Net Core API\Project\AuthECAPI\AuthECAPI
19 | build_property._RazorSourceGeneratorDebug =
20 |
--------------------------------------------------------------------------------
/AuthECClient/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "auth-ecclient",
3 | "version": "0.0.0",
4 | "scripts": {
5 | "ng": "ng",
6 | "start": "ng serve",
7 | "build": "ng build",
8 | "watch": "ng build --watch --configuration development",
9 | "test": "ng test"
10 | },
11 | "private": true,
12 | "dependencies": {
13 | "@angular/animations": "^18.0.0",
14 | "@angular/common": "^18.0.0",
15 | "@angular/compiler": "^18.0.0",
16 | "@angular/core": "^18.0.0",
17 | "@angular/forms": "^18.0.0",
18 | "@angular/platform-browser": "^18.0.0",
19 | "@angular/platform-browser-dynamic": "^18.0.0",
20 | "@angular/router": "^18.0.0",
21 | "ngx-toastr": "^19.0.0",
22 | "rxjs": "~7.8.0",
23 | "tslib": "^2.3.0",
24 | "zone.js": "~0.14.3"
25 | },
26 | "devDependencies": {
27 | "@angular-devkit/build-angular": "^18.0.7",
28 | "@angular/cli": "^18.0.7",
29 | "@angular/compiler-cli": "^18.0.0",
30 | "@types/jasmine": "~5.1.0",
31 | "jasmine-core": "~5.1.0",
32 | "karma": "~6.4.0",
33 | "karma-chrome-launcher": "~3.2.0",
34 | "karma-coverage": "~2.2.0",
35 | "karma-jasmine": "~5.1.0",
36 | "karma-jasmine-html-reporter": "~2.1.0",
37 | "typescript": "~5.4.2"
38 | }
39 | }
40 |
--------------------------------------------------------------------------------
/AuthECAPI/AuthECAPI/Controllers/WeatherForecastController.cs:
--------------------------------------------------------------------------------
1 | using AuthECAPI.Models;
2 | using Microsoft.AspNetCore.Mvc;
3 |
4 | namespace AuthECAPI.Controllers
5 | {
6 | [ApiController]
7 | [Route("[controller]")]
8 | public class WeatherForecastController : ControllerBase
9 | {
10 | private static readonly string[] Summaries = new[]
11 | {
12 | "Freezing", "Bracing", "Chilly", "Cool", "Mild", "Warm", "Balmy", "Hot", "Sweltering", "Scorching"
13 | };
14 |
15 | private readonly ILogger3 | Sign in 4 |
5 |Don't have an account?
6 | Sign up
7 |
8 |
26 |
35 |
--------------------------------------------------------------------------------
/AuthECClient/src/app/user/login/login.component.ts:
--------------------------------------------------------------------------------
1 | import { CommonModule } from '@angular/common';
2 | import { Component, OnInit } from '@angular/core';
3 | import { FormBuilder, ReactiveFormsModule, Validators } from '@angular/forms';
4 | import { Router, RouterLink } from '@angular/router';
5 | import { AuthService } from '../../shared/services/auth.service';
6 | import { ToastrService } from 'ngx-toastr';
7 |
8 | @Component({
9 | selector: 'app-login',
10 | standalone: true,
11 | imports: [CommonModule, ReactiveFormsModule, RouterLink],
12 | templateUrl: './login.component.html',
13 | styles: ``
14 | })
15 | export class LoginComponent implements OnInit {
16 | constructor(
17 | public formBuilder: FormBuilder,
18 | private service: AuthService,
19 | private router: Router,
20 | private toastr: ToastrService) { }
21 |
22 |
23 | ngOnInit(): void {
24 | if (this.service.isLoggedIn())
25 | this.router.navigateByUrl('/dashboard')
26 | }
27 | isSubmitted: boolean = false;
28 |
29 | form = this.formBuilder.group({
30 | email: ['', Validators.required],
31 | password: ['', Validators.required],
32 | })
33 |
34 | hasDisplayableError(controlName: string): Boolean {
35 | const control = this.form.get(controlName);
36 | return Boolean(control?.invalid) &&
37 | (this.isSubmitted || Boolean(control?.touched) || Boolean(control?.dirty))
38 | }
39 |
40 | onSubmit() {
41 | this.isSubmitted = true;
42 | if (this.form.valid) {
43 | this.service.signin(this.form.value).subscribe({
44 | next: (res: any) => {
45 | this.service.saveToken(res.token);
46 | this.router.navigateByUrl('/dashboard');
47 | },
48 | error: err => {
49 | if (err.status == 400)
50 | this.toastr.error('Incorrect email or password.', 'Login failed')
51 | else
52 | console.log('error during login:\n', err);
53 | }
54 | })
55 | }
56 | }
57 |
58 | }
59 |
--------------------------------------------------------------------------------
/AuthECAPI/AuthECAPI/Extensions/SwaggerExtensions.cs:
--------------------------------------------------------------------------------
1 | using AuthECAPI.Models;
2 | using Microsoft.OpenApi.Models;
3 |
4 | namespace AuthECAPI.Extensions
5 | {
6 | public static class SwaggerExtensions
7 | {
8 | public static IServiceCollection AddSwaggerExplorer(this IServiceCollection services)
9 | {
10 | // Learn more about configuring Swagger/OpenAPI at https://aka.ms/aspnetcore/swashbuckle
11 | services.AddEndpointsApiExplorer();
12 | services.AddSwaggerGen(options =>
13 | {
14 | options.AddSecurityDefinition("Bearer", new OpenApiSecurityScheme
15 | {
16 | Name = "Authorization",
17 | Type = SecuritySchemeType.Http,
18 | Scheme = "Bearer",
19 | BearerFormat = "JWT",
20 | In = ParameterLocation.Header,
21 | Description = "Fill in the JWT token",
22 | });
23 | options.AddSecurityRequirement(new OpenApiSecurityRequirement
24 | {
25 | {
26 | new OpenApiSecurityScheme
27 | {
28 | Reference = new OpenApiReference
29 | {
30 | Type = ReferenceType.SecurityScheme,
31 | Id="Bearer"
32 | }
33 | },
34 | new List
2 |
9 |
--------------------------------------------------------------------------------
/AuthECClient/src/app/app.routes.ts:
--------------------------------------------------------------------------------
1 | import { Routes } from '@angular/router';
2 | import { UserComponent } from './user/user.component';
3 | import { RegistrationComponent } from './user/registration/registration.component';
4 | import { LoginComponent } from './user/login/login.component';
5 | import { DashboardComponent } from './dashboard/dashboard.component';
6 | import { authGuard } from './shared/auth.guard';
7 | import { AdminOnlyComponent } from './authorizeDemo/admin-only/admin-only.component';
8 | import { AdminOrTeacherComponent } from './authorizeDemo/admin-or-teacher/admin-or-teacher.component';
9 | import { ApplyForMaternityLeaveComponent } from './authorizeDemo/apply-for-maternity-leave/apply-for-maternity-leave.component';
10 | import { LibraryMembersOnlyComponent } from './authorizeDemo/library-members-only/library-members-only.component';
11 | import { Under10AndFemaleComponent } from './authorizeDemo/under10-and-female/under10-and-female.component';
12 | import { MainLayoutComponent } from './layouts/main-layout/main-layout.component';
13 | import { ForbiddenComponent } from './forbidden/forbidden.component';
14 | import { claimReq } from './shared/utils/claimReq-utils';
15 |
16 | export const routes: Routes = [
17 | { path: '', redirectTo: '/signin', pathMatch: 'full' },
18 | {
19 | path: '', component: UserComponent,
20 | children: [
21 | { path: 'signup', component: RegistrationComponent },
22 | { path: 'signin', component: LoginComponent },
23 | ]
24 | },
25 | {
26 | path: '', component: MainLayoutComponent, canActivate: [authGuard],
27 | canActivateChild: [authGuard],
28 | children: [
29 | {
30 | path: 'dashboard', component: DashboardComponent
31 | },
32 | {
33 | path: 'admin-only', component: AdminOnlyComponent,
34 | data: { claimReq: claimReq.adminOnly }
35 | },
36 | {
37 | path: 'admin-or-teacher', component: AdminOrTeacherComponent,
38 | data: { claimReq: claimReq.adminOrTeacher }
39 | },
40 | {
41 | path: 'apply-for-maternity-leave', component: ApplyForMaternityLeaveComponent,
42 | data: { claimReq: claimReq.femaleAndTeacher }
43 | },
44 | {
45 | path: 'library-members-only', component: LibraryMembersOnlyComponent,
46 | data: { claimReq: claimReq.hasLibraryId }
47 | },
48 | {
49 | path: 'under-10-and-female', component: Under10AndFemaleComponent,
50 | data: { claimReq: claimReq.femaleAndBelow10 }
51 | },
52 | {
53 | path: 'forbidden', component: ForbiddenComponent
54 | }
55 | ]
56 | },
57 |
58 | ];
59 |
--------------------------------------------------------------------------------
/AuthECAPI/AuthECAPI/Extensions/IdentityExtensions.cs:
--------------------------------------------------------------------------------
1 | using AuthECAPI.Models;
2 | using Microsoft.AspNetCore.Authentication.JwtBearer;
3 | using Microsoft.AspNetCore.Authorization;
4 | using Microsoft.AspNetCore.Identity;
5 | using Microsoft.IdentityModel.Tokens;
6 | using System.Text;
7 |
8 | namespace AuthECAPI.Extensions
9 | {
10 | public static class IdentityExtensions
11 | {
12 | public static IServiceCollection AddIdentityHandlersAndStores(this IServiceCollection services)
13 | {
14 | services.AddIdentityApiEndpoints3 | Sign up 4 |
5 |Already have an account?
6 | Sign in
7 |
8 |