Gebruikers aanmelden en API aanroepen in de web-app Node.js - Toegangstoken ophalen

Artikel
23.05.2023

In dit artikel voegt u een login toe en krijgt u vervolgens een toegangstoken voor het webtoepassingsproject dat u in het vorige hoofdstuk hebt voorbereid,Bereid de clienttoepassing en API voor. De applicatie die je bouwt gebruiktMicrosoft Authentication Library (MSAL) i Nodeom het toevoegen van authenticatie en autorisatie aan de node webapplicatie te vereenvoudigen.

Maak een MSAL-configuratie object

openauthConfig.json in het bestandcode-editor en voeg vervolgens de volgende code toe:

vereisen('dotenv').config(); const TENANT_SUBDOMAIN = proces.env.TENANT_SUBDOMAIN || "Voer_Ten_Tenant_Subdomain_Hier in"; const REDIRECT_URI = proces.env.REDIRECT_URI || 'http://localhost:3000/auth/redirect'; const POST_LOGOUT_REDIRECT_URI = proces.env.POST_LOGOUT_REDIRECT_URI || 'http://lokalehost:3000'; /** * Het configuratieobject dat moet worden doorgegeven aan de MSAL-instantie tijdens het maken. * Ga voor een volledige lijst met configuratieparameters voor MSAL-knooppunten naar: * https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/lib/msal-node/docs/configuration.md * / const msalConfig = { auth: { clientId: process.env.CLIENT_ID || 'Enter_the_Application_Id_Here', // 'Application (client) ID' van de applicatieregistratie in de Azure Portal - deze waarde is de autoriteits-GUID: process.env.AUTHORITY || `https://${TENANT_SUBDOMAIN}.ciamlogin.com/`, ClientSecret: process.env.CLIENT_SECRET || 'Enter_the_Client_Secret_Here', // Clientgeheim gegenereerd op basis van applicatieregistratie in Azure Portal}, systeem: { loggerOptions: { loggerCallback(loglevel, message, comesPii) { console.log(message); }, piiLoggingEnabled: false, logLevel: 'Informatie', }, }, }; const toDoListReadScope = proces.env.TODOLIST_READ || 'api://Enter_the_Web_Api_Application_Id_Here/To Do List. Lezen'; const toDoListReadWriteScope = proces.env.TODOLIST_READWRITE || 'api://Enter_the_Web_Api_Application_Id_Here/To Do List.ReadWrite'; const protectedResources = { toDoListAPI: { endpoint: 'https://localhost:44351/api/todolist', scopes: { read: [toDoListReadScope], write: [toDoListReadWriteScope], }, }, }; module.exports = {msalConfig, protectedResources, TENANT_SUBDOMAIN, REDIRECT_URI, POST_LOGOUT_REDIRECT_URI,};

NaarmsalConfigobject bevat een set configuratie-opties die kunnen worden gebruikt om het gedrag van goedkeuringsstromen aan te passen.

Vervang erinauthConfig.jsDuur:

Voer_application_id_hier inmet de applicatie-ID (client) van de eerder geregistreerde client-webapplicatie.
Voer_tenant_subdomein_hier inen vervang het door het Map (tenant) subdomein. Als het primaire domein van uw Tenant bijvoorbeeldcontoso.onmicrosoft.comje gebruiktcontoso. Als u geen tenantnaam heeft, leest u hier hoehuurdersinformatie lezen.
Voer_hier_het_klant_geheim_inmet de geheime waarde van de clientwebtoepassing die eerder is gekopieerd.
Indtast_the_Web_Api_Application_Id_hiervan de applicatie-ID (client) van de eerder gekopieerde Web API-applicatie.
See Also
Testosteron: uitleg, effect, productie en waarden en hoe te verhogen?De API aanroepen in de voorbeeld-app Node.js daemon - Microsoft Entra

jij ziet dattodolistReadScopevariabelen entodolistReadWriteScopeneem het volledige bereik van URL's op dat u eerder hebt opgegevenBereid de clienttoepassing en API voor. Ze zijn erin gewikkeldbeschermde bronnenvoorwerp.

Snelroutes toevoegen

Express-routes bieden eindpunten waarmee we uitvoeringsacties kunnen uitvoeren, zoals inloggen, uitloggen en het weergeven van ID-tokenvereisten.

App-toegangspunt

openroutes/index.js bestandin de code-editor en voeg vervolgens de volgende code toe:

const express = kræve ("udtrykke"); const router = express.Router(); router.get('/', function (req, res, next) { res.render('index', {title: 'MSAL Node & Express Web App', isAuthenticated: req.session.isAuthenticated, brugernavn: req. session .account?.username !== '' ?request.session.account?.username: request.session.account?.name, }); }); module.export = router;

Z/Route is het toegangspunt voor de applicatie. Dit zal het wissenviews/index.hbswaar je eerder hebt gemaaktMaak applicatie-UI-componenten. Zwordt geauthenticeerdis een booleaanse waarde die bepaalt wat u in de weergave ziet.

Log in en log uit

opentrasy/auth.js-filin de code-editor en voeg vervolgens de code toeauth.jsgrote teen.
open hetcontrollerinventaris/authController.jsin de code-editor en voeg vervolgens code toe vanauthController.jsgrote teen.
Openen in de code-editorauthenticatiebestand/AuthProvider.jsen voeg code toe vanAuthProvider.jsBehalve dat.

Z/gescheidentrajecten,/UitloggenW/omleidingwordt daarin gespecificeerdbestand tras/auth.jsmaar hun logica zit erinauth/AuthProvider.js.

ZInloggenverwerkte methode/gescheidenvanaf de weg:

Hiermee wordt de inlogstroom gestart door het eerste deel van de verificatiecodestroom te activeren.
Initialiseert een instantie van avertrouwelijke klanttoepassingGebruik ditmsalConfigMSAL-configuratie object.
```
const msalInstance = dit.getMsalInstance (dit.config.msalConfig);
```
ZgetMsalInstancede methode zit erinAutorisatie providerklasse gedefinieerd als:
```
getMsalInstance(msalConfig) { teruggave van msal.ConfidentialClientApplication(msalConfig); }
```

De eerste stap in de verificatiecodestroom genereert een URL voor het aanvragen van een autorisatiecode en leidt vervolgens om naar die URL om de autorisatiecode op te halen. Deze eerste etappe is geïmplementeerd inredirectToAuthCodeUrlmethode:

async redirectToAuthCodeUrl(req, res, next, authCodeUrlRequestParams, authCodeRequestParams, msalInstance) { // Genereer PKCE-codes voordat de autorisatiestroom wordt uitgevoerd const {verifiëren, uitdagen} = wacht op this.cryptoProvider.generatePkceCodes(); // Stel gegenereerde PKCE-codes en -methoden in als session vars req.session.pkceCodes = {challengeMethod: 'S256', verifiëren: verifiëren, uitdaging: uitdaging,}; /** * Door de volgende verzoekobjecten voor elk verzoek te manipuleren, kunnen we authenticatie-artefacten verkrijgen met de gevraagde claims. Ga voor meer informatie naar: * https://azuread.github.io/microsoft-authentication-library-for-js/ref/modules/_azure_msal_node.html#authorizationurlrequest * https://azuread.github.io/microsoft- authenticatie -library-for-js/ref/modules/_azure_msal_node.html#authorizationcoderequest **/ req.session.authCodeUrlRequest = { ...authCodeUrlRequestParams, redirectUri: this.config.redirectUri, respons_postMode, '/form aanbevolen als vertrouwelijke clients codeChallenge : req.session.pkceCodes.challenge, codeChallengeMethod: req.session.pkceCodes.challengeMethod, }; req.session.authCodeRequest = { ...authCodeRequestParams, redirectUri: this.config.redirectUri, code: '', }; probeer {const authCodeUrlResponse = wacht op msalInstance.getAuthCodeUrl(req.session.authCodeUrlRequest); res.redirect(authCodeUrlResponse); } vangst (fout) { volgende (fout); }}

U kunt zien hoe we MSAL's gebruikenmethode getAuthCodeUrlom de autorisatiecode-URL te genereren:

//... const authCodeUrlResponse = na msalInstance.getAuthCodeUrl(req.session.authCodeUrlRequest); //...

U wordt dan doorgestuurd naar de URL voor de autorisatiecode zelf.

//... res.redirect(authCodeUrlResponse); //...

ZhandleRedirectverwerkte methode/omleidingvanaf de weg:
- U hebt deze route eerder opgegeven als de omleidings-URI voor uw web-app in het Microsoft Entras-beheercentrumRegistreer de webapplicatie.
- Dit eindpunt implementeert het tweede deel van het gebruik van de verificatiecodestroom. De autorisatiecode wordt gebruikt om een identificatietoken mee aan te vragenmethode om TokenByCode te verwervenvan MSAL.
```
//... const tokenResponse = na msalInstance.acquireTokenByCode(authCodeRequest, req.body); //...
```
- Wanneer u een reactie ontvangt, kunt u een Express-sessie maken en de gewenste informatie hierin opslaan. Je moet opnemenwordt geauthenticeerden ingesteld opRECHTS:
```
//... req.session.idToken = tokenResponse.idToken; req.session.account = tokenResponse.account; req.session.isAuthenticated = prawda; //...
```
Zuitloggenverwerkte methode/Uitloggenvanaf de weg:
- Hiermee wordt het uitlogproces gestart.
- Wanneer u een gebruiker uit de toepassing wilt afmelden, is het beëindigen van de sessie niet voldoende. U moet de gebruiker omleiden naaruitlog-URI. Anders kan de gebruiker zich mogelijk opnieuw authenticeren bij toepassingen zonder de inloggegevens opnieuw in te voeren. Indien de naam van de huurdercontosoer is, zo lijkt hetuitlog-URIophttps://contoso.ciamlogin.com/contoso.onmicrosoft.com/oauth2/v2.0/logout?post_logout_redirect_uri=http://localhost:3000.
```
//... const logoutUri = `${this.config.msalConfig.auth.authority}${TENANT_SUBDOMAIN}.onmicrosoft.com/oauth2/v2.0/logout?post_logout_redirect_uri=${POST_LOGOUT_REDIRECT_URI}`; req.session.destroy(() => { res.redirect(logoutUri); }); //...
```

Zie vereisten voor ID-tokens

openroutes/gebruikers.js-filin de code-editor en voeg vervolgens de volgende code toe:

const express = vereisen ("uitdrukken"); const router = express.Router(); // aangepaste middleware om de authenticatiestatusfunctie te controleren isAuthenticated(req, res, next) { if (!req.session.isAuthenticated) { return res.redirect('/auth/signin'); // omleiden naar inlogroute } next(); }; router.get('/id', isAuthenticated, // controleer of de gebruiker asynchrone functie is geverifieerd (req, res, next) { res.render('id', { idTokenClaims: req.session.account.idTokenClaims}) ; }); module.export = router;

Als de gebruiker is geverifieerd,/ID KAARTroute-id-token claimt hergebruikwidoki/id.hbsScherm. Deze weergave is eerder toegevoegdBouw de UI-componenten van de applicatie.Extract specifieke id token verzoek zoalsgegeven naam:

const podanaNazwa = req.session.account.idTokenClaims.given_name

Krijg een toegangstoken

ZgetTokenmethode ikAutorisatie providerclass laat zien hoe je een toegangstoken aanvraagt:

getToken(scopes) {niet funkcję asynchroniczną (req, res, next) { const msalInstance = authProvider.getMsalInstance(authProvider.config.msalConfig); spróbuj { msalInstance.getTokenCache().deserialize(req.session.tokenCache); const silentRequest = { konto: req.session.account, zakresy: zakresy, }; const tokenResponse = na msalInstance.acquireTokenSilent(silentRequest); req.session.tokenCache = msalInstance.getTokenCache().serialize(); req.session.accessToken = tokenResponse.accessToken; Następny(); } catch (błąd) { if (błąd instans van msal.InteractionRequiredAuthError) { req.session.csrfToken = authProvider.cryptoProvider.createNewGuid(); const state = authProvider.cryptoProvider.base64Encode( JSON.stringify({ redirectTo: 'http://localhost:3000/todos', csrfToken: req.session.csrfToken, })); const authCodeUrlRequestParams = { stan: stan, zakresy: zakresy, }; const authCodeRequestParams = { stan: stan, zakresy: zakresy, }; authProvider.redirectToAuthCodeUrl(req, res, volgende, authCodeUrlRequestParams, authCodeRequestParams, msalInstance); } następny(błąd); } }; }

Eerst probeert de functie stilletjes een toegangstoken te krijgen (zonder de gebruiker om inloggegevens te vragen):

const silentRequest = {konto: req.session.account, zakresy: zakresy,};const tokenResponse = wacht op msalInstance.acquireTokenSilent(silentRequest);

Als u het token in stilte hebt verkregen, moet u het in een sessie bewaren. U krijgt het sessietoken wanneer u de API aanroept.
```
req.session.accessToken = tokenResponse.accessToken;
```
Als u het token niet stilletjes kunt krijgen (bijvInteractieRequiredAuthBłąduitzondering), vraagt u het toegangstoken opnieuw aan.

Volgende stap

Bel API >

Gebruikers aanmelden en API aanroepen in de web-app Node.js - Toegangstoken ophalen - Microsoft Entra (2023)