Angular2 routing authGuard service
Posted By : Avilash Choudhary | 30-Jun-2017
Hi Guys.
When you starting developing a application then you need to restrict some users to access some of the resources. Guest users have only access to particular resources and login user can have access to multiple modules. To achieve this we have implement the authguard service for routing. This authguard service will check the all access parameters and if user have access to that particular resource then it will return true otherwise false. In authguard serive,
suppose you have routing.ts file like this
const appRoutes: Routes = [ { path: '', redirectTo: 'login', pathMatch: 'full' }, { path: 'login', component: LoginComponent }, { path: 'adminWeb', component: SidebarComponent, children: [ { path: '', redirectTo: 'addEnterprise', pathMatch: 'full' }, { path: 'manageMsisdn', component: ManageMsisdnComponent, canActivate: [AuthGaurdService], data: { "type": "whitelist" } }, { path: 'configureCloud', component: ConfigureCloudComponent, canActivate: [AuthGaurdService], data: { "type": "cloud" } }, { path: 'cloudManage', component: CloudManageComponent, canActivate: [AuthGaurdService], data: { "type": "cloud" } }, { path: 'slaManage', component: SlaManageComponent, canActivate: [AuthGaurdService], data: { "type": "sla" } }, ] } ]; export const routing = RouterModule.forRoot(appRoutes);
In your routing file, you have provide the Authguard Service to canActivate property, So whenever that route is checked, first of all it will look to authguard service, if he gets true then only redirect to that route, otherwise nothing will happen.
your service file will look like this:
@Injectable() export class AuthGaurdService implements CanActivate, Resolve{ constructor(private baseUtils: BaseUtils, private router: Router) { } canActivate(route: ActivatedRouteSnapshot): boolean { let data: any = route.data; if (data && data.type) { if (data.type == "whitelist") { return true; } else { this.router.navigate(["adminWeb/addEnterprise"]); // if user don't have access to whitelist module then redirect to other page return false; } } else { return true; } } }
Cookies are important to the proper functioning of a site. To improve your experience, we use cookies to remember log-in details and provide secure log-in, collect statistics to optimize site functionality, and deliver content tailored to your interests. Click Agree and Proceed to accept cookies and go directly to the site or click on View Cookie Settings to see detailed descriptions of the types of cookies and choose whether to accept certain cookies while on the site.
About Author
Avilash Choudhary
Avilash has excellent experience in developing mobile and web applications using jQuery , Javascript and PhoneGap. His hobbies are watching and playing cricket.