## Johdanto Kun kehität web-sovellusta, on ratkaisevan tärkeää suojata API-päätepisteet luvattomalta pääsyltä. Kuvittele, että rakennat verkkokauppasivustoa; et todellakaan halua, että kybervarastajat hyödyntävät API-tasi. Oletetaan, että olet jo rakentanut Express.js-sovelluksen käyttäjäautentikoinnilla, jossa käyttäjien on kirjauduttava sisään ennen tiettyjen toimien suorittamista. Jos ei, voit aloittaa matkasi [Logtolla](https://logto.io/). Käyttäjäautentikointivirran luominen vaatii vain muutaman koodirivin. Kuitenkin, jopa käyttäjäautentikoinnin jälkeen, kohtaat erilaisia vaihtoehtoja suojata API-päätepisteet. Valitettavasti useimmilla näistä vaihtoehdoista on haittapuolensa: - **Istuntoon perustuva autentikointi**: Sitoo API:n istuntotallennustilaan, mikä ei ole skaalautuva eikä sovi mikropalveluille hyvin. - **Autentikointipalvelun kutsuminen**: Tämä lisää ylimääräisen verkkohaun, mikä lisää viivettä ja kustannuksia. Jotkut autentikointipalvelut jopa veloittavat API-kutsumäärän perusteella, mikä voi johtaa suuriin kustannuksiin. Tässä opetusohjelmassa osoitamme, kuinka vahvistat API-päätepisteitä JSON Web Tokenien (JWT) ja Logton avulla. Tämä lähestymistapa tarjoaa skaalautuvuutta ja minimaalista lisäkustannusta. ## Etehtävät Ennen sukeltamista varmista, että sinulla on seuraavat: - Logto-tili. Jos sinulla ei ole sellaista, voit [rekisteröityä ilmaiseksi](https://cloud.logto.io/). - Express.js-projekti, joka tarvitsee API-suojauksen ja asiakassovelluksen, joka käyttää API:ta. - Perustiedot [JSON Web Tokenista (JWT)](https://datatracker.ietf.org/doc/html/rfc7519). Ymmärrämme, että RFC voi olla pitkä. Lyhyesti sanottuna, JWT on base64-koodattu merkkijono, joka koostuu kolmesta osasta: otsikko, sisältö ja allekirjoitus. Sisältö tallentaa haluamaasi tietoa, kun taas allekirjoitus varmistaa tokenin eheyden. ## Määritä API-resurssisi Logtossa Logto hyödyntää täysin [RFC 8707: OAuth 2.0:n resurssi-indikaattoreita](https://datatracker.ietf.org/doc/html/rfc8707) suojatakseen API-päätepisteesi. Tämä tarkoittaa, että voit määrittää API-resurssit käyttämällä niiden todellisia URL-osoitteita. Siirry "API resources"-välilehdelle Logto Consolessa ja klikkaa "Create API resource" luodaksesi uuden. Esimerkiksi, jos haluat suojata `/api/products`-päätepisteen, voit käyttää URL-osoitetta `https://yourdomain.com/api/products` tunnisteena. ![Luo API-resurssi](https://uploads.strapi.logto.io/1/create_api_resource_13a2c8e660.png) ## Hanki käyttöoikeustoken asiakassovelluksessasi Jatkaaksemme, sinun täytyy integroida Logto SDK asiakassovellukseesi. Tämä sovellus saattaa erota Express.js-taustastasi; esimerkiksi sinulla saattaa olla React-sovellus, joka käyttää Express.js:n tausta-API-palvelinta. Sinun on myös hienosäädettävä Logto SDK -konfiguraatio ilmoittaaksesi Logtolle, että haluat pyytää käyttöoikeustokeneita tähän käyttölupaan. Tässä on esimerkki käyttäen Reactia: ```tsx import { LogtoProvider } from '@logto/react'; const App = () => { return ( ); }; ``` Kun käyttäjä kirjautuu sisään Logtolla, `isAuthenticated` Logto SDK:ssa muuttuu `true`: ```tsx import { useLogto } from '@logto/react'; const Content = () => { const { isAuthenticated } = useLogto(); console.log(isAuthenticated); // true }; ``` Nyt voit käyttää `getAccessToken`-menetelmää hakeaksesi käyttöoikeustoken API:llesi: ```tsx const Content = () => { const { getAccessToken, isAuthenticated } = useLogto(); useEffect(() => { if (isAuthenticated) { const accessToken = await getAccessToken('https://yourdomain.com/api/products'); console.log(accessToken); // eyJhbG... } }, [isAuthenticated, getAccessToken]); }; ``` Lopuksi, sisällytä tämä käyttöoikeustoken `Authorization`-otsikkoon tehdessäsi pyyntöjä API:llesi: ```tsx const Content = () => { const { getAccessToken, isAuthenticated } = useLogto(); useEffect(() => { if (isAuthenticated) { const accessToken = await getAccessToken('https://yourdomain.com/api/products'); const response = await fetch('https://yourdomain.com/api/products', { headers: { Authorization: `Bearer ${accessToken}`, }, }); } }, [isAuthenticated, getAccessToken]); }; ``` ## Varmista käyttöoikeustoken API:ssasi Express.js-sovelluksessasi asenna `jose`-kirjasto JWT-varmennusta varten: ```bash npm install jose ``` Koska käytämme Bearer-autentikointia, ota käyttöoikeustoken `Authorization`-otsikosta: ```ts import { IncomingHttpHeaders } from 'http'; const extractBearerTokenFromHeaders = ({ authorization }: IncomingHttpHeaders) => { if (!authorization) { throw new Error('Autentikointiotsikko puuttuu'); } if (!authorization.startsWith('Bearer')) { throw an Error('Autentikointiotsikko ei ole Bearer-muodossa'); } return authorization.slice(7); // 'Bearer ' pituus on 7 }; ``` Seuraavaksi luo middleware varmentaaksesi käyttöoikeustokenin: ```ts import { createRemoteJWKSet, jwtVerify } from 'jose'; // Generoi JWKS käyttäen jwks_uri, joka saadaan Logto-palvelimelta // Korvaa `` Logto-päätepisteelläsi, esim. `abc123.logto.app` const jwks = createRemoteJWKSet(new URL('https:///oidc/jwks')); export const authMiddleware = async (req, res, next) => { // Ota token käyttöön yllä määritellyllä apufunktiolla const token = extractBearerTokenFromHeaders(req.headers); const { payload } = await jwtVerify( // Raaka Bearer Token, joka on otettu pyynnön otsikosta token, jwks, { // Odotettu tokenin myöntäjä, joka on toimitettu Logto-palvelimen kautta issuer: 'https:///oidc', // Odotettu kohde tokenille, nykyisen API:n resurssi-indikaattori audience: 'https://yourdomain.com/api/products', } ); // Sub on käyttäjä-ID, jota käytetään käyttäjän tunnistamiseen const { scope, sub } = payload; // Käsittelemme roolipohjaisen pääsynhallinnan myöhemmin assert(scope.split(' ').includes('read:products')); return next(); }; ``` Voit nyt käyttää tätä middlewarea suojataksesi API-päätepisteesi: ```ts app.get('/api/products', authMiddleware, (req, res) => { // ... }); ``` Tällä lähestymistavalla sinun ei tarvitse ottaa yhteyttä Logto-palvelimeen aina, kun pyyntö saapuu. Sen sijaan haet JSON Web Key Setin (JWKS) Logto-palvelimelta kerran ja tarkistat käyttöoikeustokenit paikallisesti. ## Roolipohjainen pääsynhallinta Tähän mennessä olemme vain varmistaneet, että käyttäjä on kirjautunut sisään Logton avulla. Emme vieläkään tiedä, onko käyttäjällä sopiva oikeus käyttää API-päätepistettä. Tämä johtuu siitä, että Logto sallii kenen tahansa saada käyttöoikeustoken olemassa olevalle API-resurssille. Voidaksemme käsitellä tämä, voimme käyttää roolipohjaista pääsynhallintaa (RBAC). Logtossa voit määritellä rooleja ja antaa heille oikeuksia. Tutustu [tähän opetusohjelmaan](https://docs.logto.io/docs/recipes/rbac/) oppiaksesi, miten määrittelet roolit ja oikeudet Logtossa. Roolien ja oikeuksien määrittelyn jälkeen voit lisätä `scopes`-vaihtoehdon `LogtoProvider`-komponenttiin: ```tsx ``` Logto myöntää sitten vain käyttöoikeustokenin sopivilla määritelmillä käyttäjälle. Esimerkiksi, jos käyttäjällä on vain `read:products`-oikeus, käyttöoikeustoken sisältää ainoastaan tämän oikeuden: ```json { "scope": "read:products", "sub": "1234567890" } ``` Jos käyttäjällä on sekä `read:products` että `write:products`-oikeudet, käyttöoikeustoken sisältää molemmat määritelmät välilyönnillä erottimena: ```json { "scope": "read:products write:products", "sub": "1234567890" } ``` Express.js-sovelluksessasi voit varmistaa, että käyttöoikeustoken sisältää oikeat määritelmät ennen pääsyn myöntämistä API-päätepisteelle: ```ts assert(scope.split(' ').includes('read:products')); ``` ## Yhteenveto API-päätepisteiden suojaaminen samalla kun varmistetaan skaalautuvuus ei ole pieni tehtävä. Logtossa pyrimme yksinkertaistamaan pyyntötodentamisen kehittäjille, jolloin voit keskittyä enemmän liiketoimintalogiikkaasi. Jos sinulla on kysymyksiä, liity [Discord-palvelimellemme](https://discord.gg/UEPaF3j5e6). Yhteisömme on aina valmis auttamaan sinua. Kokeile Logtoa tänään