Mikrofrontendarkitektur med Module Federation · Lektion

Autentisering och auktorisering

Implementera robusta mekanismer för autentisering och auktorisering mellan olika Micro Frontends.

Lektion 1 av 411 steg

Autentisering och auktorisering är en gratis lektion i Mikrofrontendarkitektur med Module Federation på CoddyKit. Detta är lektion 1 av 4. Ni kan läsa hela lektionen gratis nedan och sedan öva praktiskt i webbläsaren med en inbyggd kodredigerare och en AI-handledare som är tillgänglig dygnet runt. Den ingår i lärvägen för Mikrofrontendarkitektur med Module Federation, och Era framsteg synkroniseras mellan webben och CoddyKit-appen. Kursen i Mikrofrontendarkitektur med Module Federation innehåller totalt 4 lektioner.

Autentisering och behörighet i MFE:er

Välkommen till Authentication & Authorization i Micro Frontends! Det innebär unika utmaningar att säkra federerade applikationer jämfört med monolitiska appar.

Vi behöver robusta sätt att verifiera användares identiteter (autentisering) och styra vad de får åtkomst till (auktorisering) i självständigt utvecklade och distribuerade Micro Frontends.

Behovet av centraliserad autentisering

I en Micro Frontend-arkitektur interagerar användare med flera separata applikationer. Om varje MFE hanterade autentisering självständigt skulle användarna mötas av flera inloggningsförfrågningar.

Det leder till en dålig användarupplevelse och komplex sessionshantering. En centraliserad autentiseringsmekanism är avgörande för smidig navigering.

Identitetsleverantörer (IdP)

En vanlig lösning är att använda en Identity Provider (IdP). Det är en tjänst som skapar, underhåller och hanterar identitetsinformation om användare samt autentiserar dem.

Exempel: Auth0, Okta, Keycloak eller en anpassad OAuth 2.0/OpenID Connect-server.
IdP:n hanterar inloggningsprocessen och utfärdar säkerhetstoken (som JWT:er) när autentiseringen lyckas.

Översikt över autentiseringsflödet

Här är ett förenklat flöde för centraliserad autentisering:

Användaren försöker komma åt en MFE.
Om användaren inte är autentiserad omdirigeras hen till den centrala IdP:ns inloggningssida.
Användaren loggar in med IdP:n.
IdP:n omdirigerar användaren tillbaka till MFE:n med en säkerhetstoken.
MFE:n lagrar tokenen (till exempel i en HTTP-only-cookie eller i lokal lagring).

Alla efterföljande förfrågningar från alla MFE:er använder denna token.

Delning av autentiseringstillstånd

När en användare har autentiserats måste sessionen eller tokenen vara tillgänglig för alla Micro Frontends. Vanliga strategier för att dela tillstånd är:

HTTP-only-cookies: Säkra och skickas automatiskt med förfrågningar.
Web Storage (localStorage/sessionStorage): Tillgängligt mellan domäner med samma ursprung.
Delade bibliotek/kontext: Ett delat verktyg som kapslar in tokenhanteringen och ofta exponeras via Module Federation.

Varje metod innebär avvägningar när det gäller säkerhet och hur enkel den är att implementera.

Auktorisering förklarad

Medan autentisering verifierar vem du är avgör auktorisering vad du får göra.

Efter autentiseringen innehåller säkerhetstokenen ofta användarroller eller behörigheter.
Varje Micro Frontend ansvarar sedan för att kontrollera dessa behörigheter innan åtkomst till specifika funktioner eller data beviljas.

Rollbaserad åtkomstkontroll (RBAC)

Rollbaserad åtkomstkontroll (RBAC) är en vanlig strategi för auktorisering. Användare tilldelas roller (till exempel 'admin', 'editor' och 'viewer'), och varje roll har specifika behörigheter.

Micro Frontends kontrollerar helt enkelt användarens roller mot de roller som krävs för en viss åtgärd eller komponent.

Implementera autentiseringskontroller

Varje mikrofrontend eller dess backend-API kan implementera auktoriseringskontroller. Detta innebär ofta att:

Avkoda säkerhetstokenet för att hämta användarroller och behörigheter.
Jämföra dessa med de behörigheter som krävs för en viss åtgärd eller ett visst UI-element.

Här är ett enkelt JavaScript-exempel:

function hasPermission(userRoles, requiredRole) {
  if (!userRoles || !requiredRole) return false;
  return userRoles.includes(requiredRole);
}

// Imagine user roles are parsed from a JWT
const currentUserRoles = ["user", "editor"]; 

// Check if user can 'edit_post'
const canEdit = hasPermission(currentUserRoles, "editor");

// Check if user can 'delete_user'
const canDelete = hasPermission(currentUserRoles, "admin");

console.log("Can edit post?", canEdit);
console.log("Can delete user?", canDelete);

Bästa praxis för säkerhet

Att säkra era federerade applikationer kräver ständig vaksamhet:

HTTPS: Använd alltid HTTPS för all kommunikation.
Lagring av token: Lagra känsliga token på ett säkert sätt, till exempel i HTTP-only-cookies i stället för localStorage.
CORS: Konfigurera reglerna för Cross-Origin Resource Sharing korrekt.
Indatavalidering: Validera alltid användarindata på både klient- och serversidan.
Regelbundna granskningar: Genomför säkerhetsgranskningar och håll beroendena uppdaterade.

Ordna autentiseringsflödet

Dra och släpp stegen för att ordna en användares första autentiseringsflöde korrekt i en federerad applikation som använder en identitetsleverantör (IdP).

Besvara frågan i den interaktiva lektionen

Sammanfattning: Säkra MFE:er

Vi har gått igenom grunderna i autentisering och auktorisering i mikrofronter. Viktiga slutsatser:

Centraliserad autentisering via en identitetsleverantör ger en smidig användarupplevelse.
Säkerhetstoken, till exempel JWT:er, innehåller data för autentisering och auktorisering.
Strategier som HTTP-only-cookies eller delade bibliotek hjälper till att dela autentiseringstillstånd.
Auktorisering, till exempel RBAC, styr vad användare får göra utifrån roller och behörigheter i deras token.
Följ alltid bästa praxis för säkerhet, till exempel HTTPS och säker lagring av token.

Därefter undersöker vi säkerhetsrisker mellan applikationer.

Gratis att börja

Lär dig JavaScript med en AI-lärare – gratis

Skriv och kör riktig kod i webbläsaren, få omedelbar hjälp av en AI-lärare dygnet runt och fortsätt där du slutade – på webben eller i appen.

Kurser: 12
Lektioner: 48

Börja lära dig gratis Visa hela kursen

Vanliga frågor

Är lektionen ”Autentisering och auktorisering” gratis?

Ja – hela texten till ”Autentisering och auktorisering” kan läsas gratis här på webben. Om Ni vill öva interaktivt med en inbyggd kodredigerare och en AI-handledare som är tillgänglig dygnet runt och låsa upp resten av kursen i Mikrofrontendarkitektur med Module Federation, kan Ni uppgradera till CoddyKit PRO. Kursen i Mikrofrontendarkitektur med Module Federation innehåller totalt 4 lektioner.

Vad lär jag mig i ”Autentisering och auktorisering”?

Implementera robusta mekanismer för autentisering och auktorisering mellan olika Micro Frontends. Ni övar på Mikrofrontendarkitektur med Module Federation med praktisk kod som körs direkt i webbläsaren, medan en AI-handledare som är tillgänglig dygnet runt svarar på Era frågor under lektionen.

Behöver jag någon erfarenhet för att börja lära mig Mikrofrontendarkitektur med Module Federation?

Du behöver inga förkunskaper. Utbildningen i Mikrofrontendarkitektur med Module Federation på CoddyKit är upplagd för allt från nybörjare till avancerade elever, så att du kan börja här eller från början och gå fram i din egen takt. Detta är lektion 1 av 4.

Hur lång tid tar lektionen ”Autentisering och auktorisering”?

De flesta CoddyKit-lektioner tar cirka 5–10 minuter. Varje lektion är kort och interaktiv, så att du gör stadiga framsteg och kan fortsätta precis där du slutade – på webben eller i appen.

Kan jag skriva och köra kod i den här Mikrofrontendarkitektur med Module Federation-lektionen?

Ja. Varje Mikrofrontendarkitektur med Module Federation-lektion innehåller en inbyggd kodredigerare, så att du kan skriva och köra riktig kod direkt i webbläsaren och få omedelbar AI-feedback – utan lokal installation.

Alla lektioner i den här kursen

← Tillbaka till Mikrofrontendarkitektur med Module Federation