રૂટ ગાર્ડ્સ શું છે?

Question

રૂટ ગાર્ડ્સ શું છે?

Accepted Answer

**Route guards** એ ફંક્શન છે જે **નિયંત્રિત કરે છે કે રૂટમાં/થી નેવિગેશન અનુમતિ છે કે નહીં**. તે રૂટ સક્રિય થવાથી પહેલે (અથવા તમે એકને છોડતા પહેલે) ચલાવે છે, પ્રમાણીકરણ ચેક, પરવાનગી નિયંત્રણ અને "અસંરક્ષિત ફેરફાર" પ્રોમ્પ્ટ સક્ષમ કરે છે. ## ગાર્ડ પ્રકારો ```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 એપ્લિકેશન જે લાગુ કરે છે તે છે.