Login
Login-komponentti yksinkertaistaa käyttäjän todennusta tarjoamalla valmiin kirjautumisvalintaikkunan, jossa on käyttäjänimi- ja salasana-kentät. Se sisältää ominaisuuksia, kuten syötteen validointi, muokattavat tarrat ja viestit, salasanan näkyvyysohjaukset sekä tukea lisäkohtaisille kentille.
Näytä koodi
- Java
Kirjautumisen lähettäminen
Kun käyttäjät syöttävät käyttäjänimensä ja salasanansa, Login-komponentti validoi nämä syötteet pakollisiksi kentiksi. Kun validointi on onnistunut, lomakkeen lähetys tapahtuu, ja syötetyt tunnistetiedot toimitetaan. Useiden lähetyksien estämiseksi [Kirjaudu sisään] -painike on heti poistettu käytöstä.
Seuraavassa kuvataan yksinkertaista Login-komponenttia. Jos käyttäjänimi ja salasana on asetettu molemmat arvoksi "admin", kirjautumisvalintaikkuna sulkeutuu, ja [Kirjaudu ulos] -painike ilmestyy. Jos tunnistetiedot eivät täsmää, oletusvirheilmoitus näytetään.
Näytä koodi
- Java
Oletuksena Login poistaa heti käytöstä [Kirjaudu sisään] -painikkeen, kun komponentti validoi kirjautumissyötteet oikein useiden lähetyksien estämiseksi. Voit ottaa [Kirjaudu sisään] -painikkeen uudelleen käyttöön käyttämällä setEnabled(true) -metodia.
Voit sallia käyttäjien kirjautuvan sisään pelkän käyttäjänimen avulla käyttämällä setEmptyPassword(true) -metodia.
Lomake toiminto 25.10
Login-komponentti voi lähettää lomakedataa suoraan määritettyyn URL-osoitteeseen sen sijaan, että se käsittelisi lähettämistä lomakkeen lähetys tapahtuman kautta. Kun toimint URL on asetettu, lomake suorittaa standardin POST-pyynnön käyttäjänimen ja salasanan muodossa.
Login login = new Login();
login.setAction("/api/auth");
Kun käytetään setAction(), lomakkeen lähetys ohittaa LoginSubmitEvent-tapahtuman ja suorittaa sen sijaan perinteisen HTTP POST -pyynnön määritettyyn päätepisteeseen. Käyttäjänimi ja salasana lähetetään lomakkeen parametreina, jotka on nimetty "username" ja "password", vastaavasti. Mukautetut kentät, joilla on nimeämiselementti, sisällytetään myös POST-pyyntöön.
Jos toimint URL:ää ei ole asetettu, lomakkeen lähetys käsitellään LoginSubmitEvent-tapahtuman kautta, jolloin voit käsitellä tunnistetietoja ohjelmallisesti palvelinpuolella.
Kansainvälisyys (i18n)
Login-komponentin otsikot, kuvaukset, tarrat ja viestit ovat täysin mukautettavissa LoginI18n-luokan avulla. Tämä joustavuus mahdollistaa kirjautumisliittymän räätälöimisen tiettyjen lokalisointi vaatimusten tai henkilökohtaisten mieltymysten mukaan.
Näytä koodi
- Java
Mukautetut kentät
Login-komponentti sisältää useita slotteja, jotka mahdollistavat ylimääräisten kenttien lisäämisen tarvittaessa. Mukautetut kentät kerätään automaattisesti, kun lomake lähetetään, ja niitä voidaan käsitellä lähetys tapahtuman datakartalla.
Seuraavassa kirjautumisessa on lisätty mukautettu kenttä asiakas-ID:lle. Tämä voi auttaa hallitsemaan yrityksiä tai osastoja, joilla on yhteistä sisältöä useiden käyttäjien kesken.
Näytä koodi
- Java
- CSS
Mukautettujen kenttien on oltava nimettyinä setName()-metodilla, jotta ne voitaisiin sisällyttää lomakkeen lähetykseen. Nimi käytetään avaimena kentän arvon hakemiseen event.getData() -menetelmällä.
Peruuta-painike
Login-komponentti sisältää [Peruuta]-painikkeen, joka on oletuksena piilotettu. Tämä on erityisen hyödyllistä, kun käyttäjä yrittää päästä sovelluksen rajoitetulle alueelle ja tarvitsee vaihtoehdon palata edelliseen sijaintiinsa ilman kirjautumista.
Jotta peruuta-painike olisi näkyvissä, anna sille etiketti. Voit myös kuunnella peruuttamistapahtumia käsitelläksesi peruuttamista asianmukaisesti.
Näytä koodi
- Java
Jos haluat piilottaa elementin, aseta sen etiketti tyhjään merkkijonoon. Tämä mahdollistaa näkyvyyden vaihtamisen poistamatta komponenttia koodistasi.
Salasananhallintajärjestelmät
Tämä komponentti toimii selaimen salasanan hallintajärjestelmien kanssa kirjautumisprosessin yksinkertaistamiseksi. Chromium-pohjaisissa selaimissa se integroituu PasswordCredential API:iin, joka tarjoaa:
- Automaattinen täyttö: Selain saattaa automaattisesti täyttää käyttäjänimi- ja salasanakentät, jos käyttäjällä on tallennettuja tunnistetietoja sivustolle.
- Tunnistetietojen hallinta: Kirjauduttuaan selain voi kehottaa käyttäjää tallentamaan uusia tunnistetietoja, mikä tekee tulevista kirjautumisista nopeampia ja helpompia.
- Tunnistetietojen valinta: Jos useita tunnistetietoja on tallennettu, selain voi tarjota käyttäjälle mahdollisuuden valita yhdestä tallennetuista sarjoista.