Conectare pe propria pagină

Majoritatea aplicațiilor trimit oamenii la Lobby-ul mediului ca să se conecteze. Dacă preferați să-i păstrați pe propria pagină, <SignIn /> din @usher/react îi conectează chiar acolo, apoi finalizează cu OpenID Connect exact ca până acum: serverul dvs. primește în continuare tokenurile de la Usher și nicio parolă și niciun token nu trece prin pagina dvs.

Permiteți originea aplicației

În Usher Console, deschideți mediul, apoi Conectare → Conectare încorporată, și adăugați originea aplicației dvs., cum ar fi https://app.example.com. Doar originile din listă pot folosi Frontend API al mediului și doar pentru conectare.

Adăugați componenta

import { SignIn } from '@usher/react'

export function SignInPage() {
  return <SignIn frontendApi="https://login.example.com" returnTo="/dashboard" />
}

Componenta stă în interiorul UsherProvider pe care îl folosește deja @usher/nextjs. frontendApi este emitentul mediului.

Ce se întâmplă

• Întâi adresa de e-mail, apoi o parolă sau un cod prin e-mail, apoi al doilea pas, dacă persoana are unul. Conectarea prin rețele sociale și Continuați cu Usher trec pe la furnizor și revin în aplicația dvs.
• Apoi OpenID Connect. Odată conectată persoana la mediu, componenta trimite browserul la /auth/sign-in al aplicației dvs., care trece direct prin Usher și revine cu un cod. Prima dată, Usher îi cere persoanei să permită accesul aplicației dvs.
• Protecția împotriva boților funcționează ca în Lobby: când Usher cere o dovadă de lucru, componenta o face.
• Orice altceva (chei de acces, conectare pentru companii, crearea unui cont) este un link spre Lobby.

Folosiți propriul domeniu în producție

Componenta păstrează sesiunea Usher în cookie-urile mediului. În producție, acestea trebuie să fie primare (first-party): dați mediului propriul dvs. domeniu, pe același site cu aplicația (login.example.com pentru app.example.com). În dezvoltare, un mediu care permite încorporarea își trimite cookie-urile între site-uri, lucru pe care Chrome îl acceptă. Acolo unde un browser nu le păstrează, componenta predă ștafeta Lobby-ului.