பாதை காவலர்கள் என்றால் என்ன?

Question

Accepted Answer

**பாதை காவலர்கள்** என்பவை **ஒரு பாதைக்கு/இருந்து நேவிகேஷன் அனுமதிக்கப்பட்டுள்ளதா என்பதை கட்டுப்படுத்தும்** செயல்பாடுகளாகும். அவை ஒரு பாதை செயல்படுத்தப்படுவதற்கு முன் (அல்லது அதிலிருந்து வெளியேறுவதற்கு முன்) இயங்குகின்றன, அங்குறிப்பு சரிபார்ப்பு, அনுமதி கட்டுப்பாடு மற்றும் "சேமிக்கப்படாத மாற்றங்கள்" கோரிக்கைகளை செயல்படுத்துகின்றன. ## காவலர் வகைகள் ```text CanActivate → can the user enter this route? (auth/permission check) CanActivateChild → same, for child routes CanDeactivate → can the user LEAVE? ("you have unsaved changes") CanMatch → should this route even be matched? (feature flags, role-based) resolve → pre-fetch data BEFORE the route activates ``` ## ஒரு செயல்பாட்டு CanActivate காவலர் (நவீன Angular) ```ts import { CanActivateFn, Router } from "@angular/router"; import { inject } from "@angular/core"; export const authGuard: CanActivateFn = (route, state) => { const auth = inject(AuthService); const router = inject(Router); if (auth.isLoggedIn()) { return true; // allow navigation } return router.createUrlTree(["/login"]); // redirect to login }; ``` ஒரு காவலர் `true` (அனுமதி), `false` (முடக்கு) அல்லது `UrlTree` (திறுப்பாற்றவும்) வழங்குகிறது. நவீன Angular **செயல்பாட்டு காவலர்களை** (வெற்று செயல்பாடுகள் `inject()` உடன்) பதிலாக பழையவற்றை வகுப்பு-அடிப்படையிலான பயன்படுத்துகின்றன. ## பாதைகளில் காவலர்களைப் பயன்படுத்துவது ```ts export const routes: Routes = [ { path: "dashboard", component: DashboardComponent, canActivate: [authGuard], // protect this route }, { path: "admin", component: AdminComponent, canMatch: [roleGuard], // only match for admins }, ]; ``` ## CanDeactivate — தற்செயல் தரவு இழப்பைத் தடுக்க ```ts export const unsavedChangesGuard: CanDeactivateFn = (component) => { if (component.form.dirty) { return confirm("You have unsaved changes. Leave anyway?"); } return true; }; ``` இந்த உன்னதமான காவலர் சேமிக்கப்படாத திருத்தங்கள் உள்ள படிவத்திலிருந்து நகர்த்த முன் பயனர்களை எச்சரிக்கிறது. ## காவலர்கள் ஒத்திசைவற்றவாக இருக்கலாம் ```ts export const authGuard: CanActivateFn = () => inject(AuthService).checkSession().pipe(map(ok => ok || router.createUrlTree(["/login"]))); // guards can return Observable or Promise ``` ## ஏன் முக்கியம் कாவலர்கள் Angular இல் அணுக கட்டுப்பாடு மற்றும் நேவிகேஷன் விதிகளைக் கட்டாயப்படுத்த நிலையான, மைய முறை ஆகும் — அங்குறிப்பிக்கப்பட்ட பாதைகளைப் பாதுகாப்பு, பாத்திரம்/அனுமதி மூலம் கணக்கெடுப்பு, வெளியேறலில் தரவு இழப்பைத் தடுக்க மற்றும் முன்கூட்டியே தரவைப் பெற (resolvers). இந்த சரிபார்ப்புகளை காவலர்களில் வைப்பது (பூ பகிர்ந்தளிக்கப்படுவதற்கு பதிலாக) பாதுகாப்பு மற்றும் நேவிகேஷன் தர্க்கம் நிலையான மற்றும் நியமக உண்மை மற்றும் மீண்டும் பாதுகாக்கப்பட்ட பாதைகளில் `authGuard` என்பது கிட்டத்தட்ட ஒவ்வொரு உண்மையான Angular அ உதாரணம் செயல்படுத்துகிறது.