रूट गार्ड्स म्हणजे काय?

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 मध्ये प्रवेश नियंत्रण आणि नेव्हिगेशन नियम लागू करण्याचा मानक, केंद्रीकृत मार्ग आहे — प्रमाणीकृत मार्गांचे संरक्षण, भूमिका/परवानगीद्वारे गेटिंग, बाहेर पडताना डेटा नुकसान रोकणे आणि डेटा पूर्व-लोडिंग (resolver). हे तपास गार्ड्समध्ये ठेवणे (घटकांमध्ये विखुरलेले असण्याऐवजी) सुरक्षा आणि नेव्हिगेशन लॉजिक सुसंगत आणि घोषणात्मक ठेवते; संरक्षित मार्गांवर `authGuard` हे असे काही आहे जे व्यावहारिकरित्या प्रत्येक वास्तविक Angular अॅप अंमलबजावणी करते.