Kirjautuminen omalla sivullasi

Useimmat sovellukset lähettävät ihmiset ympäristönsä Lobbyyn kirjautumaan. Jos haluat mieluummin pitää heidät omalla sivullasi, @usher/react-paketin <SignIn /> kirjaa heidät sisään siinä samassa ja viimeistelee sitten OpenID Connectilla täsmälleen kuten ennenkin: palvelimesi saa yhä tunnuksensa Usherilta, eikä mikään salasana tai tunnus kulje sivusi kautta.

Salli sovelluksesi alkuperä

Avaa Usher Consolessa ympäristö ja sitten Kirjautuminen → Upotettu kirjautuminen, ja lisää sovelluksesi alkuperä (origin), kuten https://app.example.com. Vain luetellut alkuperät saavat käyttää ympäristön Frontend API:a, ja vain kirjautumiseen.

Lisää komponentti

import { SignIn } from '@usher/react'

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

Komponentti toimii sen UsherProvider-komponentin sisällä, jota @usher/nextjs jo käyttää. frontendApi on ympäristösi myöntäjä.

Mitä tapahtuu

• Ensin sähköposti, sitten salasana tai sähköpostikoodi ja sen jälkeen toinen vaihe, jos ihmisellä on sellainen käytössä. Kirjautuminen sometilillä ja ”Jatka Usherilla” vievät palveluntarjoajalle ja palaavat sovellukseesi.
• Sitten OpenID Connect. Kun ihminen on kirjautunut ympäristöösi, komponentti lähettää selaimen sovelluksesi reitille /auth/sign-in, joka kulkee suoraan Usherin kautta ja palaa koodin kanssa. Ensimmäisellä kerralla Usher pyytää ihmistä sallimaan sovelluksesi.
• Bottisuojaus toimii kuten Lobbyssa: kun Usher pyytää työtodistetta (proof of work), komponentti tekee sen.
• Kaikki muu (pääsyavaimet, yrityskirjautuminen, tilin luominen) on linkki Lobbyysi.

Käytä tuotannossa omaa verkkotunnustasi

Komponentti pitää Usherin istunnon ympäristösi evästeissä. Tuotannossa niiden on oltava ensimmäisen osapuolen evästeitä: anna ympäristölle oma verkkotunnuksesi samalta sivustolta kuin sovelluksesi (login.example.com sovellukselle app.example.com). Kehityksessä ympäristö, joka sallii upottamisen, lähettää evästeensä sivustojen välillä, minkä Chrome hyväksyy. Jos selain ei säilytä niitä, komponentti ohjaa kirjautumisen Lobbyysi.