Rakenna CapacitorJS-autentikointi Logton avulla
Tässä opetusohjelmassa näytämme, kuinka rakentaa autentikointivirtaus Logton avulla Capacitorissa. Tämä mahdollistaa alustarajat ylittävien sisään- ja rekisteröitymisvirtausten luomisen helposti.
Tässä opetusohjelmassa näytämme, kuinka rakentaa autentikointivirtaus Logton avulla Capacitorissa. Tämä mahdollistaa alustarajat ylittävien sisään- ja rekisteröitymisvirtausten luomisen helposti.
Tässä opetusohjelmassa näytämme, kuinka rakentaa autentikointivirtaus Logton avulla Capacitorissa. Tämä mahdollistaa alustarajat ylittävien sisään- ja rekisteröitymisvirtausten luomisen helposti.
Ennen aloitusta, varmista, että sinulla on seuraavat:
Päästäksesi alkuun, luo Logto-sovellus "Native"-tyypillä. Logto-sovellukset toimivat asiakassovelluksina OAuth 2.0 ja OpenID Connect (OIDC) virtauksissa. Seuraa näitä vaiheita luodaksesi Logto-sovelluksen:

Sovelman luomisen jälkeen, määritä uudelleenohjaus URI. Uudelleenohjaus URI:ta käytetään ohjaamaan käyttäjä takaisin sovellukseesi autentikointivirran jälkeen.
Varmista, että URI ohjaa Capacitor-sovellukseen, esimerkiksi com.example.app://callback. Arvo voi vaihdella Capacitor-sovelluksen kokoonpanon mukaan. Lisätietoja löydät kohdasta Capacitor Deep Links.
Muista napsauttaa Tallenna muutokset päivitettyäsi uudelleenohjaus URI:n.
Jos et ole varma uudelleenohjaus URI:sta, voit jättää sen tyhjäksi nyt ja päivittää sen myöhemmin.
Oletetaan, että sinulla on jo Capacitor-projekti, tämä opetusohjelma on kehysagnostinen, joten voit käyttää mitä tahansa haluamaasi käyttöliittymäkehystä ja päivittää koodin vastaavasti.
endpoint on Logto API:n päätepiste. Löydät sen sisäänrakennetusta oppaasta tai Toimialueet-osiosta vuokrausasetuksissa.appId on Logto-sovelluksen tunnus. Löydät sen sovelluksen tietosivulta.Lisää seuraava koodi sisäänkirjautumisnapin onClick-käsittelijään:
Korvaa com.example.app://callback uudelleenohjaus URI:lla, jonka määritit Logto-sovelluksessa.
Aja Capacitor-sovellus ja napsauta kirjautumisnappia. Selainikkuna avautuu ja uudelleenohjaa Logto-sisäänkirjautumissivulle.

Koska Capacitor hyödyntää Safari View Controlleria iOS:ssä ja Chrome Custom Tabeja Androidissa, autentikointitila voi säilyä jonkin aikaa. Joskus käyttäjä voi kuitenkin haluta kirjautua ulos sovelluksesta heti. Tässä tapauksessa voimme käyttää signOut-metodia kirjautuaksemme käyttäjän ulos:
signOut-metodilla on optionalinen parametri uloskirjautumisen jälkeiselle uudelleenohjaus URI:lle. Jos sitä ei anneta, käyttäjä ohjataan Logto-uloskirjautumissivulle:

Käyttäjän tulee napsauttaa "Valmis" sulkeakseen verkkonäytön ja palatakseen Capacitor-sovellukseen. Jos haluat automaattisesti ohjata käyttäjän takaisin Capacitor-sovellukseen, voit antaa uloskirjautumisen jälkeiselle uudelleenohjaus URI:lle:
Varmista, että uloskirjautumisen jälkeinen uudelleenohjaus URI ohjaa Capacitor-sovellukseen, ja muista lisätä uloskirjautumisen jälkeinen uudelleenohjaus URI Logto Consoleen:

Aja Capacitor-sovellus uudelleen ja napsauta kirjautumisnappia. Jos kaikki menee hyvin, kun autentikointivirta on valmis, Capacitor-sovellus vastaanottaa kirjautumisen tuloksen ja tulostaa käyttäjän väitteet konsoliin.

Sitten napsauta uloskirjautumisnappia, ja Capacitor-sovellus ohjataan Logto-uloskirjautumissivulle. Se ohjautuu automaattisesti takaisin Capacitor-sovellukseen, jos uloskirjautumisen jälkeinen uudelleenohjaus URI on määritetty.
Nyt voit määrittää autentikointivirran Logto Cloud Consolessa kirjoittamatta monimutkaista koodia. Määritys koskee kaikkia asiakassovelluksia, taaten yhtenäisen käyttäjäkokemuksen.
Jos kohtaat ongelmia integraation aikana, älä epäröi ottaa meihin yhteyttä sähköpostitse osoitteessa [email protected] tai liity Discord-palvelimellemme!