Wachtwoord

HTML

input

HTML attributen

type="password"

Wanneer het attribuut type de waarde password heeft wordt er een tekstvak getoond dat werkt als een tekstvak, maar de ingevoerde tekens worden niet getoond. Als er nu iemand over de schouder van de gebruiker meekijkt, kan hij of zij gevoelige gegevens zoals wachtwoorden niet zien.

name

Het attribuut name geeft de naam van het wachtwoord-tekstvak, die met het wachtwoord dat de gebruiker invult naar de server gestuurd wordt. Je moet het name attribuut opgeven als je wilt dat het wachtwoord naar de server gestuurd wordt.

size, maxlength

Net als het gewone tekstvak ondersteunt ook dit tekstvak de attributen size en maxlength. Hoewel het wachtwoord op het scherm verborgen wordt, betekent dit niet dat de gegevens in een wachtwoord-tekstvak veilig naar de server verstuurd worden.

Je moet hier nooit gebruik van maken voor het verzenden van gevoelige gegevens zoals creditcardnummers. Voor volledige beveiliging moet de server worden ingesteld voor communicatie met behulp van Secure Sockets Layer (SSL). Als je wil weten hoe je dat doet, ga naar de website van Robert Nyman, Adding HTTPS to your web site, April 19, 2016. Dit behoort voor alle duidelijkheid niet tot de leerstof!

Voorbeeld

Code

<div>
    <label for="password">Wachtwoord</label>
    <input type="password" name="password" maxlength="20" id="password"></div>
<div>

Resultaat

Hou in gedachten dat amhoewel iemand die over je schouder meekijkt het paswoord niet kan lezen, het paswoord open en bloot door de browser naar de server wordt gestuurd. Dat kan je zien als je volgende code opent in CodePen en op de submit knop klikt.

Alhoewel het paswoord niet in het tekstvak te zien is, wordt het open en bloot naar de server gestuurd. Als je op de Verzenden knop klikt antwoordt CodePen met: