Käytännön opas ja esimerkki Passport.js:n integroimiseksi Logton kanssa.
Passport.js on autentikointivälimuisti Node.js:lle, joka voidaan huomaamattomasti lisätä mihin tahansa Express-pohjaiseen verkkosovellukseen. Tämä kattava opas keskittyy passport-openidconnect -liitännäisen hyödyntämiseen, tarjoten yksinkertaisen mutta tehokkaan tavan yhdistää Logto Passport.js:n kanssa. Tämän opetusohjelman läpi käytämme Express.js:tä rakentamaan sovellustamme. Kaikki koodi, jota keskustelemme, on saatavilla julkisessa GitHub-repositoriossa.
Ennen kuin sukellamme integraatioprosessiin, meidän on perustettava perusprojekti asentamalla Express.js ja sen istuntovälimuisti.
Oletetaan, että sinulla on TypeScript-projektiympäristö valmiina (jos ei, katso virallinen TypeScript-dokumentaatio), aloita asentamalla tarvittavat paketit:
Luo src/app.ts seuraavalla koodilla:
Tämä skripti alustaa Express-sovelluksen ja määrittää cookieParser- ja session-välimuistit keksi-pohjaista istunnonhallintaa varten, mikä on olennaista autentikointitulosten tallentamiseen Passport.js:ssä. Se sitten käyttää http-moduulia palvelun käynnistämiseen.
Jatkaaksesi Logto-sovellus on tarpeen. Luo yksi vierailemalla Logto Console, siirry kohtaan “Applications” ja klikkaa “Create application”. Valitse “Express”, nimeä sovelluksesi ja klikkaa “Create application”.
Suoritettuasi tai luettuasi luomisohjeen loppuun, löydät yksityiskohtaisen sivun konfigurointitietoineen seuraaville vaiheille.
Sovelluksen yksityiskohtasivulla, määritä kaksi arvoa:
http://localhost:3000/callback sovelluksen takaisinsoitto-reitin mukaisesti.http://localhost:3000 yksinkertaisuuden vuoksi, ohjaamalla käyttäjät etusivulle kirjautumisen jälkeen.Voit muuttaa näitä arvoja myöhemmin.
Asenna passport ja OIDC-strategialiitännäinen, passport-openidconnect:
Luo app/config.ts konfiguroinnin hallintaan:
Aseta ympäristömuuttujat vastaavasti:
| Ympäristömuuttuja | Kuvaus | Esimerkki |
|---|---|---|
APP_ID | Sovelluksen ID Logtosta | 4ukboxxxxxxxxx |
APP_SECRET | Sovelluksen salaisuus Logtosta | 5aqccxxxxxxx |
ENDPOINT | Logto-päätepiste | https://g5xxx.logto.app/ |
Luo src/passport.ts
Tämä koodi alustaa Passport OpenIDConnectStrategy -strategialla. Sarjallista ja desarjallista menetelmiä on asetettu esimerkin vuoksi.
Varmista, että alustat ja liität Passport-välimuistin sovellukseesi:
Luomme nyt tietyt reitit autentikointiprosesseille:
/sign-inTämä reitti rakentaa ja ohjaa OIDC-auktorisointireitille.
/callbackTämä käsittelee OIDC sisäänkirjautumispalautteen, tallentaa tunnukset ja ohjaa etusivulle.
/sign-outTämä uudelleenohjaa Logton istunnon päättämispolulle ja sitten takaisin etusivulle.
Kehitetään etusivu autentikointitilalla:
Tässä käyttäjätietoja näytetään JSON.stringify-kutsulla, ja request.user-olemassaoloa käytetään reittien suojaamiseen.
Onnittelut Passport.js:n ja Logto:n integroimisesta. Toivottavasti tämä opas voi auttaa siirtymään olemassa olevista järjestelmistä Logto:n käyttöön. Autentikointikokemuksen parantamiseksi harkitse Logto Cloudin kokeilemista tänään. Hyvää koodausta!