✅ Slik setter du Input Password i HTML5

Innholdsfortegnelse

Egenskap passord oppretter en inngang for dataregistrering som når brukeren går inn i dem vil bli representert som prikker eller stjerner ("*") på skjermen, noe som gjør det vanskelig eller umulig for en tredjepart å lese hvordan dataene legges inn i skjemaet.
Dette attributtet fungerer sammen med andre attributter som det også deler med elementet inn tekstLa oss huske og se hvilke som deles av denne.

[farge = # 808080]Maks lengde: [/ color] Dette elementet er ikke nytt i HTML5, men det er veldig nyttig siden det lar oss begrense det maksimale antallet tegn som inngangen godtar. Et eksempel er når passordene våre må inneholde maksimalt tegn, for eksempel 6 alfanumeriske tegn, setter vi denne attributten med verdi 6, og når vi prøver å skrive inn en syvende, ville den ganske enkelt ikke bli skrevet.

[farge = # 808080]Mønster: [/ color] Nytt i HTML5 lar oss angi vanlige uttrykksmønstre slik at vi kan legge til et nytt valideringsnivå uten å bruke flere språk.

[farge = # 808080]Plassholder: . plassholder "skriv inn passordet ditt", selvfølgelig justerer du stilene for å få alt til å se estetisk korrekt ut.

[farge = # 808080]Bare lesing: [/ color] Dette attributtet er ikke nytt i HTML5, det lar oss gjøre at brukeren ikke kan legge inn data eller redigere innholdet i feltet som har dette attributtet.

[farge = # 808080]Obligatorisk: [/ color] Nytt i HTML5, dette attributtet lar oss indikere at hvis innspillet er tomt, skal ikke skjemaet sendes inn ennå, og dermed tvinge det obligatoriske fyllet, på denne måten øker vi et annet valideringsnivå.

[farge = # 808080]Størrelse: [/ color] Det hjelper oss å spesifisere bredden på inputelementet, dette attributtet er ikke nytt, men det er veldig viktig siden det hjelper oss å gi et bedre bilde av teksten som brukeren må skrive inn, i tillegg til å hjelpe oss estetisk for å lage homogene inndatafelt, siden de alle kan plasseres med en bredde større enn den som er brakt som standard.

[farge = # 808080]Verdi: [/ color] Det er ikke nytt i HTML5, dette attributtet lar oss plassere verdier til et input, det er forskjellig fra plassholderen siden det som er i verdi som tildeles ved innsending hvis det ville bli sendt som innhold i elementet, er ganske vant til å fylle et skjema med innhold som hentes fra databasen når vi bruker et serverspråk.

Etter å ha sett teorien, la oss se et praktisk eksempel på det:

Eksempel

Yam:

Passord:

Frukt:

Send inn stemme

Hvordan vi ser i dette tilfellet bruker vi attributtet plassholder for å angi hvilken type passord vi forventer, på denne måten veileder vi brukeren og reduserer feil, når elementet begynner å bli skrevet, erstattes teksten til plassholderen med stjerner eller med andre elementer som ikke lar det bli kjent at det blir skrevet.

FORSTØRRE

En annen viktig forholdsregel vi må ta er at selv om vi ikke kan lese det vi skriver i passordfeltet, når innholdet kommer på siden som skal behandle skjemaet, kommer innholdet uten noen form for kryptering, så vi vet at dataene reiser uten beskyttelse, for eksempel hvis vi behandler det forrige skjemaet, mottar vi dette:

Hvis vi ønsker større sikkerhet må vi vurdere å bruke servere med sikre protokoller som f.eks SSL / HTTPS De krypterer informasjonen de sender eller bruker språk som Javascript for å kryptere informasjonen før den sendes.
Med dette avslutter vi denne opplæringen gjennom prosessen med å lage skjemaer for å legge inn sensitive data, og vi kjenner implikasjonene og sikkerhetstiltakene vi må ta for å bevare integriteten til dataene som beveger seg fra et skjema når vi vil at de ikke skal kunne leses med det blotte øye ..