Bejelentkezés a saját oldaladon
A legtöbb app a környezete Lobbyjába küldi bejelentkezni az embereket. Ha inkább a saját oldaladon tartanád őket, a @usher/react csomag <SignIn /> komponense ott helyben bejelentkezteti őket, majd pontosan úgy fejezi be OpenID Connecttel, mint eddig: a szervered továbbra is az Ushertől kapja a tokenjeit, és sem jelszó, sem token nem halad át az oldaladon.
Engedélyezd az appod originjét
Az Usher Console-ban nyisd meg a környezetet, majd a Bejelentkezés → Beágyazott bejelentkezés részt, és add hozzá az appod originjét, például https://app.example.com. Csak a felsorolt originek használhatják a környezet Frontend API-ját, és csak bejelentkezésre.
Add hozzá a komponenst
import { SignIn } from '@usher/react'
export function SignInPage() {
return <SignIn frontendApi="https://login.example.com" returnTo="/dashboard" />
}Abban az UsherProvider komponensben kap helyet, amelyet a @usher/nextjs már használ. A frontendApi a környezeted kibocsátója.
Mi történik
- Először az e-mail-cím, aztán egy jelszó vagy egy e-mailben küldött kód, majd a második lépés, ha az illetőnek van ilyen. A közösségi bejelentkezés és a Folytatás az Usherrel a szolgáltatóhoz visz, onnan pedig vissza az appodba.
- Aztán OpenID Connect. Miután az illető bejelentkezett a környezetedben, a komponens az appod
/auth/sign-inútvonalára küldi a böngészőt, amely egyenesen átmegy az Usheren, és egy kóddal tér vissza. Első alkalommal az Usher megkérdezi az illetőt, engedélyezi-e az appodat. - A botvédelem ugyanúgy működik, mint a Lobbyban: ha az Usher munkabizonyítékot kér, a komponens elvégzi.
- Minden más (jelkulcsok, vállalati bejelentkezés, fiók létrehozása) egy link a Lobbydhoz.
Éles környezetben használd a saját domainedet
A komponens az Usher munkamenetét a környezeted cookie-jaiban tartja. Éles környezetben ezeknek first-party cookie-knak kell lenniük: add meg a környezetnek a saját domainedet, az appoddal azonos webhelyen (login.example.com az app.example.com mellé). Fejlesztői környezetben a beágyazást engedélyező környezet webhelyek között is elküldi a cookie-jait, amit a Chrome elfogad. Ahol egy böngésző nem tartja meg őket, a komponens inkább átadja a feladatot a Lobbydnak.