Siirry pääsisältöön

Login

Avaa ChatGPT:ssa
Shadow dwc-login 24.01
Java API

Login-komponentti on suunniteltu tarjoamaan käyttäjäystävällinen käyttöliittymä todennusta varten, jolloin käyttäjät voivat kirjautua sisään käyttäjätunnuksen ja salasanan avulla. Se tukee erilaisia mukautuksia käyttäjäkokemuksen parantamiseksi eri laitteilla ja kielillä.

Näytä Koodi

Käytöt​

Login-komponentti tarjoaa käyttäjäystävällisen kirjautumislomakkeen käyttöliittymän dialogissa todennusasiakirjojen syöttämistä varten. Se parantaa käyttäjäkokemusta tarjoamalla:

  • Selkeät syöttökentät käyttäjätunnukselle ja salasanalle.
  • Näkyvyyden vaihto salasanalle syötteen vahvistamiseksi.
  • Syöttövalidointipalautetta oikean muotoilun varmistamiseksi ennen lähettämistä.

Kirjautumisen lähettäminen​

Kun käyttäjät syöttävät käyttäjätunnuksensa ja salasanansa, kirjautumis komponentti validoi nämä syötteet pakollisina kenttinä. Kun validointi on läpäisty, lomakkeen lähettämistapahtuma laukaistaan, ja syötetyt asiakirjat toimitetaan. Estääkseen useita lähetyksiä Signin-painike poistetaan välittömästi käytöstä.

Alla oleva demo havainnollistaa perustavanlaatuista lomakkeen lähettämisprosessia. Jos käyttäjätunnus ja salasana on asetettu molemmat arvoksi "admin", kirjautumisdialogi sulkeutuu ja kirjautumisnappi tulee näkyviin. Jos asiakirjat eivät sovi yhteen, kirjautumislomakkeen oletusvirheilmoitus näytetään.

Näytä Koodi

Signin-painikkeen poistaminen käytöstä

Oletuksena kirjautumislomake poistaa välittömästi käytöstä Signin-painikkeen, kun komponentti validoi kirjautumissyötteet oikein useiden lähetyksen estämiseksi. Voit ottaa Signin-painikkeen uudelleen käyttöön käyttämällä menetelmää setEnabled(true).

Tyhjien salasanojen salliminen

Tietyissä tilanteissa tyhjät salasanat voivat olla sallittuja, jolloin käyttäjät voivat kirjautua sisään vain käyttäjätunnuksella. Kirjautumisdialogia voidaan määrittää hyväksymään tyhjät salasanat asettamalla setEmptyPassword(true).

Kansainvälistäminen (i18n)​

Kirjautumiskomponentin otsikot, kuvastot, etiketit ja viestit ovat täysin mukautettavissa käyttämällä LoginI18n-luokkaa. Tämä joustavuus antaa sinulle mahdollisuuden räätälöidä kirjautumisen käyttöliittymä vastaamaan erityisiä lokalisointi vaatimuksia tai personointitoiveita.

Alla oleva demo havainnollistaa, kuinka kirjautumisdialogille voidaan antaa saksankielinen käännös varmistaen, että kaikki käyttöliittymäelementit mukautetaan saksan kielelle parantaakseen käyttäjäkokemusta saksankielisille käyttäjille.

Näytä Koodi

Mukautetut kentät​

Kirjautumiskomponentti sisältää useita slotteja, jotka antavat sinun lisätä ylimääräisiä kenttiä tarpeen mukaan. Tämä ominaisuus tarjoaa enemmän hallintaa tarvittavasta tiedosta onnistuneen todennuksen varmistamiseksi.

Alla olevassa esimerkissä asiakas-ID-kenttä lisätään kirjautumislomakkeeseen. Käyttäjien on annettava voimassa oleva ID todentamisen suorittamiseksi parantaen turvallisuutta ja varmistaen, että pääsy myönnetään vain kaikkien vaadittavien asiakirjojen vahvistamisen jälkeen.

Näytä Koodi

Lähetyksen kuorma

Huomaa, että kirjautumiskomponentti ei automaattisesti tunnista tai sisällä ylimääräisiä kenttiä, jotka on lisätty lomakkeeseen sen lähetyskuormassa. Tämä tarkoittaa, että kehittäjien on nimenomaisesti haettava lisäkenttien arvot asiakassivulta ja käsiteltävä niitä sovelluksen vaatimusten mukaisesti todentamisprosessin loppuunsaattamiseksi.

Peruuta-painike​

Tietyissä tilanteissa voi olla toivottavaa lisätä peruuta-painike Signin-painikkeen rinnalle. Tämä ominaisuus on erityisen hyödyllinen, kun käyttäjä yrittää päästä rajoitettuun sovelluksen alueeseen ja tarvitsee mahdollisuuden peruuttaa toiminto ja palata edelliseen sijaintiinsa. Kirjautumislomakkeella on oletuksena peruuta-painike, mutta se on piilotettu näkyvistä.

Jotta peruuta-painike tulee näkyviin, sinun on annettava sille etiketti - kun se on nimetty, se näkyy näytöllä. Voit myös kuunnella peruutustapahtumia vastataksesi käyttäjän toimintaan varmistaaksesi sujuvan ja käyttäjäystävällisen kokemuksen sovelluksessa navigoimisessa.

Näytä Koodi

Elementtien piilottaminen

Jotta voit piilottaa elementin kirjautumissivulta, aseta sen etiketti vain tyhjään merkkijonoon. Tämä lähestymistapa on erityisen hyödyllinen käyttöliittymäkomponenttien tilapäiseen poistamiseen ilman, että koodipohjaa tarvitsisi pysyvästi muuttaa.

Salasananhallintajärjestelmät​

Kirjautumiskomponentti on suunniteltu yhteensopivaksi selainpohjaisten salasananhallintajärjestelmien kanssa, parantaakseen käyttäjäkokemusta yksinkertaistamalla kirjautumisprosessia. Chromium-pohjaisten selainten käyttäjille komponentti integroituu saumattomasti PasswordCredential API:n kanssa. Tämä integraatio mahdollistaa useita käteviä ominaisuuksia:

  • Automaattinen täyttö: Selaimessa voi automaattisesti täyttää käyttäjätunnus- ja salasanakentät, jos käyttäjä on tallentanut asiakirjat sivustolle.
  • Asiakirjojen hallinta: Kirjautumisen jälkeen selain voi kehottaa käyttäjää tallentamaan uusia asiakirjoja, jolloin tulevat kirjautumiset ovat nopeampia ja helpompia.
  • Asiakirjojen valinta: Jos useita asiakirjoja on tallennettuna, selain voi tarjota käyttäjälle mahdollisuuden valita yhdestä tallennetusta asiakirjasta.

Tyylittely​

Loading...