Bescherm je Express.js API met JWT en Logto

Introductie#

Wanneer je een webapplicatie ontwikkelt, is het cruciaal om je API-eindpunten te beschermen tegen ongeautoriseerde toegang. Stel je voor dat je een online winkelwebsite bouwt; je wilt zeker niet dat cyberdieven je API exploiteren.

Stel dat je al een Express.js-applicatie hebt gebouwd met gebruikersauthenticatie, waarbij gebruikers moeten inloggen voordat ze bepaalde acties kunnen ondernemen. Zo niet, dan kun je je avontuur starten met Logto. Het vereist slechts een paar regels code om een gebruikersauthenticatiestroom op te zetten.

Echter, zelfs na gebruikersauthenticatie, sta je voor verschillende keuzes om je API-eindpunten te beschermen. Helaas hebben de meeste van deze opties hun nadelen:

• Sessie-gebaseerde authenticatie: Het koppelen van je API aan een sessiestore, wat niet schaalbaar is en niet goed past bij microservices.
• Aanroepen van een authenticatieservice: Dit introduceert een extra netwerkoproep, wat latentie en kosten verhoogt. Sommige authenticatieservices rekenen zelfs kosten op basis van API-oproepvolume, wat kan leiden tot flinke uitgaven.

In deze handleiding demonstreren we hoe je je API-eindpunten kunt versterken met behulp van JSON Web Tokens (JWT) en Logto. Deze aanpak biedt schaalbaarheid en minimale extra kosten.

Vereisten#

Voordat we beginnen, zorg ervoor dat je het volgende hebt:

• Een Logto-account. Als je er geen hebt, kun je gratis aanmelden.
• Een Express.js-project dat API-bescherming nodig heeft en een client-applicatie die de API gebruikt.
• Basiskennis van JSON Web Token (JWT).

Definieer je API-resource in Logto#

Logto maakt volledig gebruik van RFC 8707: Resource Indicators for OAuth 2.0 om je API-eindpunten te beveiligen. Dit betekent dat je je API-resources kunt definiëren met hun daadwerkelijke URL's.

Navigeer naar het tabblad "API-resources" in de Logto Console en klik op "Create API resource" om een nieuwe te maken. Als je bijvoorbeeld het /api/products-eindpunt wilt beschermen, kun je de URL https://yourdomain.com/api/products als de identifier gebruiken.

Verkrijg een toegangstoken in je client-applicatie#

Om verder te gaan, moet je de Logto SDK in je client-applicatie integreren. Deze applicatie kan verschillen van je Express.js backend; bijvoorbeeld, je hebt mogelijk een React-app die Express.js als de backend API-server gebruikt.

Je moet ook de Logto SDK-configuratie aanpassen om Logto te informeren dat je een toegangstoken voor je API in deze grant wilt aanvragen. Hier is een voorbeeld met React:

Zodra een gebruiker zich aanmeldt bij Logto, wordt isAuthenticated binnen de Logto SDK true:

Nu kun je de methode getAccessToken gebruiken om een toegangstoken voor je API te verkrijgen:

Voeg ten slotte dit toegangstoken toe in de Authorization-header bij het maken van verzoeken aan je API:

Verifieer het toegangstoken in je API#

In je Express.js applicatie installeer je de jose-bibliotheek voor JWT-verificatie:

Aangezien we Bearer-authenticatie gebruiken, haal je het toegangstoken uit de Authorization-header:

Vervolgens maak je een middleware om het toegangstoken te verifiëren:

Je kunt nu deze middleware gebruiken om je API-eindpunten te beschermen:

Met deze aanpak hoef je niet elke keer dat er een verzoek binnenkomt contact op te nemen met de Logto-server. In plaats daarvan haal je de JSON Web Key Set (JWKS) eenmalig van de Logto-server op en verifieer je vervolgens lokaal toegangstokens.

Role-based toegangscontrole#

Tot nu toe hebben we alleen geverifieerd dat een gebruiker is ingelogd met Logto. We weten nog steeds niet of de gebruiker over de juiste toestemming beschikt om toegang te krijgen tot het API-eindpunt. Dit komt omdat Logto iedereen toestaat om een toegangstoken voor een bestaande API-resource te verkrijgen.

Om dit aan te pakken, kunnen we role-based toegangscontrole (RBAC) toepassen. In Logto kun je rollen definiëren en hieraan permissies toekennen. Raadpleeg deze handleiding om te leren hoe je rollen en permissies in Logto kunt definiëren.

Na het definiëren van rollen en permissies, kun je de scopes-optie toevoegen aan de LogtoProvider-component:

Logto zal dan alleen een toegangstoken met de juiste scope(s) aan de gebruiker toekennen. Bijvoorbeeld, als een gebruiker alleen de scope read:products heeft, zal het toegangstoken alleen die scope bevatten:

Als een gebruiker zowel de read:products als write:products scopes heeft, zal het toegangstoken beide scopes bevatten met een spatie als scheidingsteken:

In je Express.js-applicatie kun je verifiëren of het toegangstoken de juiste scope(s) bevat voordat je toegang verleent tot het API-eindpunt:

Conclusie#

Het beschermen van API-eindpunten terwijl je zorgt voor schaalbaarheid is geen gemakkelijke taak. Bij Logto streven we ernaar om aanvraagauthenticatie voor ontwikkelaars te vereenvoudigen, zodat je meer kunt focussen op je bedrijfslogica.

Voor vragen kun je gerust onze Discord-server joinen. Onze community helpt je graag verder.