Efter att användarens identitet är bekräftad (autentiserad) sker själva behörighetskontrollen (auktoriseringen). I det enkla fallet har alla användare tillgång till all funktionalitet och data i en applikation, men detta är sällan fallet i större system.
Vi kontrollerar användarens behörighet i gränssnittet för att ge en bättre användarupplevelse, inte för att bygga ett säkert system. Eftersom all JavaScript-kod i en applikation är enkel att läsa ska man utgå från att det inte går att dölja information eller data på klienten. Alla funktionsanrop och datafrågor måste även valideras och kontrollers i API:et eller på servern.
I en front-end applikation är det vanligt att jobba mot en tjänst som administrerar användares konton och profiler. Ibland delas denna tjänst mellan flera applikationer och kallas då för single sign-on providers.
När klienten autentiserar en användare får man i regel tillbaka en användarprofil, med exempelvis claims eller roller. Eftersom roller och claims tenderar att förändras över tiden, särskilt om de delas med andra applikationer är ett tips att normalisera till ett internt format i applikationen. Till exempel kan man översätta en roll till en uppsättning rättigheter i applikationen. I applikationen sker sedan kontroll mot dessa rättigheter istället för användarens roll. Detta innebär att om en roll kommer till eller försvinner behöver du endast ändra på ett ställe i applikationen.
Titta på bilden nedan, du inser antagligen att det är betydligt enklare att kontrollera användarens behörighet på applikationsnivå än att tända och släcka individuella element i vyerna. Det vill säga, om möjligt ge en användare behörighet till moduler istället för att rendera vyerna annorlunda beroende på roll. Detta är dels enklare att underhålla och ger bättre prestanda.
Om två roller ska använda en modul på helt olika sätt bör du fundera på om det inte kan vara värt att bygga två separata moduler.
Bryt ut kontrollen av användarens behörighet i en service, i exemplen nedan kallat authService. Denna tjänst kan vi sedan skjuta in där det krävs.
Använder du UI-Router sker ett event när användaren navigerar mellan states. Detta är ett bra tillfälle att kontrollera om användaren har tillgång till den nya vyn. Du kan spara vilken rättighet ditt state kräver som meta-data på statet. Injecta sedan din authService för att kontrollera användarens behörighet vid navigering. Detta är bra om användaren manuellt skriver in en URL i adressfältet.
Även om det är bättre att kontrollera användarens behörighet på en högre nivå är det ibland ett krav att visa eller ändra enskilda element för en typ av användare. I den globala navigeringen är det också bra att kunna visa eller ändra enskilda element baserat på användarens rättigheter.
För att kunna kontrollera behörighet direkt i vyn kan du göra authService globalt tillgänglig, t.ex. genom att hänga den på $rootScope. Du kan sedan göra kontroller direkt i vyn enligt nedan.
Ladda ned kodprojektet som följer med artikeln för att se exemplen ovan i helhet.
