Comment désactiver le navigateur Autocomplete sur le champ de formulaire web / étiquette d'entrée?

comment désactiver autocomplete dans les principaux navigateurs pour un input (ou form field ) spécifique?

2313
demandé sur molerat 2008-08-05 20:22:32
la source

30 ответов

Firefox 30 ignore autocomplete="off" pour les mots de passe, optant pour demander à l'utilisateur à la place si le mot de passe doit être stocké sur le client. Note: commentaire du 5 mai 2014:

  • Le gestionnaire de mot de passe toujours vous demande si on veut enregistrer un mot de passe. Les mots de passe ne sont pas enregistrés sans la permission de l'utilisateur.
  • Nous sommes le troisième navigateur implémentez ce changement, après IE et Chrome.

Selon Mozilla developer documentation la forme d'attribut d'élément autocomplete empêche les données de formulaire à partir de la mise en cache dans les navigateurs plus anciens.

<input type="text" name="foo" autocomplete="off" />
2264
répondu nlucaroni 2015-01-20 12:23:39
la source

en plus de autocomplete=off , vous pouvez aussi faire randomiser vos noms de champs de formulaires par le code qui génère la page, peut-être en ajoutant une chaîne de caractères propre à la session à la fin des noms.

lorsque le formulaire est soumis, vous pouvez enlever cette partie avant de les traiter du côté du serveur. Cela empêcherait le navigateur web de trouver le contexte pour votre champ et pourrait aussi aider à prévenir les attaques XSRF parce qu'un attaquant ne serait pas en mesure de deviner les noms de champ pour la soumission d'un formulaire.

253
répondu Ben Combee 2018-05-07 10:56:55
la source

la plupart des principaux navigateurs et gestionnaires de mots de passe (correctement, IMHO) ignorent maintenant autocomplete=off .

pourquoi? De nombreuses banques et d'autres sites "haute sécurité" ont ajouté autocomplete=off à leurs pages de connexion "à des fins de sécurité", mais cela diminue en fait la sécurité car cela fait que les gens changent les mots de passe sur ces sites à haute sécurité pour être facile à se souvenir (et donc crack) depuis autocomplete a été cassé.

il y a longtemps la plupart des gestionnaires de mots de passe commencé à ignorer autocomplete=off , et maintenant les navigateurs commencent à faire la même chose pour les entrées de nom d'utilisateur/mot de passe seulement.

malheureusement, les bogues dans les implémentations autocomplètes insèrent des informations de nom d'utilisateur et/ou de mot de passe dans des champs de formulaire inappropriés, provoquant des erreurs de validation de formulaire, ou pire encore, insérant accidentellement des noms d'utilisateur dans des champs qui ont été intentionnellement laissés en blanc par l'utilisateur.

que doit faire un développeur web?

  • si vous pouvez garder tous les champs de mot de passe sur une page par eux-mêmes, c'est un bon début car il semble que la présence d'un champ de mot de passe est le principal déclencheur pour l'utilisateur/pass autocomplete pour donner un coup de pied. Sinon, lisez les conseils ci-dessous.
  • Safari remarque qu'il y a 2 champs de mot de passe et désactive autocomplete dans ce cas, en supposant qu'il doit s'agir d'un formulaire de changement de mot de passe, pas d'un formulaire de connexion. Alors assurez-vous d'utiliser 2 champs de mot de passe (nouveau et confirmer nouveau) pour tous les formulaires où vous autorisez
  • Chrome 34, malheureusement, va essayer de Auto remplir les champs avec l'Utilisateur/passer chaque fois qu'il voit un champ de mot de passe. C'est un assez mauvais bug qui, espérons-le, va changer le comportement du Safari. Cependant, l'ajout de ceci au haut de votre formulaire semble désactiver le mot de passe autofill:

    <input type="text" style="display:none">
    <input type="password" style="display:none">
    

Je n'ai pas encore enquêté sur IE ou Firefox soigneusement, mais sera heureux de mettre à jour la réponse si d'autres ont des informations dans les commentaires.

189
répondu apinstein 2018-01-25 01:14:37
la source

Parfois même autocomplete=off serait empêche pas de remplir dans les informations d'identification en mal de champs, mais pas d'utilisateur ou pseudo champ.

cette solution s'ajoute au billet d'apinstein sur le comportement du navigateur.

fix navigateur de remplissage automatique en lecture seule et est définie en écriture sur l'objet (et cliquez sur l'onglet

 <input type="password" readonly  
     onfocus="this.removeAttribute('readonly');"/>

mise à jour: Safari Mobile Fixe le curseur dans le domaine, mais ne pas afficher le clavier virtuel. Le nouveau correctif fonctionne comme avant mais gère le clavier virtuel:

<input id="email" readonly type="email" onfocus="if (this.hasAttribute('readonly')) {
    this.removeAttribute('readonly');
    // fix for mobile safari to show virtual keyboard
    this.blur();    this.focus();  }" />

Live Demo https://jsfiddle.net/danielsuess/n0scguv6 /

/ / UpdateEnd

parce que le navigateur remplit automatiquement les informations d'identification au mauvais champ de texte!?

je remarque ce comportement étrange sur Chrome et Safari, quand il ya des champs de mot de passe dans le même formulaire. je suppose que le navigateur recherche un champ de mot de passe pour insérer vos justificatifs d'identité enregistrés. Puis il remplit automatiquement (en devinant juste à cause de l'observation) le champ textlike-input le plus proche, qui apparaît avant le champ password dans DOM. Comme le navigateur est la dernière instance et que vous ne pouvez pas le contrôler,

cette simple correction ci-dessus a fonctionné pour moi.

123
répondu dsuess 2018-01-25 01:58:31
la source
<form name="form1" id="form1" method="post" 
      autocomplete="off" action="http://www.example.com/form.cgi">

cela fonctionnera dans Internet Explorer et Mozilla FireFox, l'inconvénient est qu'il n'est pas la norme XHTML.

94
répondu brendan 2018-01-06 09:36:51
la source

la solution pour Chrome est d'ajouter autocomplete="new-password" au mot de passe de type input.

exemple:

<form name="myForm"" method="post">
<input name="user" type="text" />
<input name="pass" type="password" autocomplete="new-password" />
<input type="submit">
</form>

Chrome toujours autocomplete les données si elle trouve une boîte de type mot de passe , juste assez pour indiquer pour cette boîte autocomplete = "new-password" .

cela fonctionne bien pour moi.

Note: assurez-vous avec F12 que vos modifications prennent effet, plusieurs fois les navigateurs enregistrez la page dans le cache, cela m'a donné une mauvaise impression qu'il ne fonctionne pas, mais le navigateur n'a pas réellement apporter les modifications.

61
répondu Geynen 2016-11-24 20:07:18
la source

Comme d'autres l'ont dit, la réponse est autocomplete="off"

cependant, je pense qu'il vaut la peine de dire pourquoi c'est une bonne idée de l'utiliser dans certains cas car certaines réponses à cette question et duplicate questions ont suggéré qu'il est préférable de ne pas l'éteindre.

arrêter les navigateurs stockant les numéros de carte de crédit ne devrait pas être laissé aux utilisateurs. Trop d'utilisateurs ne réalisent même pas que c'est un problème.

il est particulièrement important de l'éteindre sur les champs pour les codes de sécurité de carte de crédit. Comme cette page États:

" ne conservez jamais le code de sécurité ... sa valeur dépend de la présomption que le seul moyen de la Fournir est de la lire à partir de la carte de crédit physique, prouvant que la personne qui la fournit détient effectivement la carte."

le problème est, si c'est un ordinateur public (cybercafé, bibliothèque etc) il est alors facile pour d'autres utilisateurs de voler vos détails de carte, et même sur votre propre machine un site Web malveillant pourrait voler autocomplete données .

53
répondu Sam Hasler 2018-01-25 11:59:39
la source

je vous prie d'être en désaccord avec ces réponses qui disent d'éviter de désactiver l'auto-complete.

la première chose à signaler est que l'auto-complèt n'étant pas explicitement désactivé sur les champs de formulaire de connexion est un échec PCI-DSS. En outre, si la machine locale d'un utilisateur est compromise, alors toutes les données autocomplètes peuvent être trivialement obtenues par un attaquant parce qu'il est stocké dans le clair.

Il ya certainement un argument pour la facilité d'utilisation, mais il ya un très bon équilibre quand il s'agit de la forme que les champs doivent avoir autocomplete désactivé et qui ne devrait pas.

29
répondu Securatek 2014-04-23 07:54:36
la source

Trois options: Premier:

<input type='text' autocomplete='off' />

la Deuxième:

<form action='' autocomplete='off'>

troisième (code javascript):

$('input').attr('autocomplete', 'off');
25
répondu yajay 2015-10-30 00:20:37
la source

vient de définir autocomplete="off" . Il y a une très bonne raison pour faire cela: vous voulez fournir votre propre fonctionnalité autocomplete!

18
répondu EndangeredMassa 2015-08-01 13:45:01
la source

j'ai essayé des solutions sans fin, et puis j'ai trouvé ceci:

au lieu de autocomplete="off" utilisez simplement autocomplete="false"

Aussi simple que cela, et il fonctionne comme un charme dans Google Chrome!

18
répondu Kaszoni Ferencz 2015-08-01 13:48:25
la source

Sur une ou fait, sur la complètement à l'opposé de note

"Si vous êtes l'utilisateur du formulaire précité et souhaitez réactiver la fonctionnalité autocomplete, utilisez le 'remember password' bookmarklet de ce bookmarklets page . Il supprime tous les attributs autocomplete="off" de tous les formulaires sur la page. Garder le bon combat!"

17
répondu Antti Sykäri 2018-01-06 10:34:42
la source

nous avons effectivement utilisé sasb l 'idée pour un site. C'était une application web pour gérer le cabinet d'un médecin. Toutefois, bon nombre de nos clients étaient des chirurgiens qui utilisaient de nombreux postes de travail différents, y compris des terminaux semi-publics. Donc, ils voulaient s'assurer qu'un médecin qui ne comprend pas l'implication des mots de passe enregistrés automatiquement ou qui ne fait pas attention ne puisse pas laisser accidentellement leurs informations de connexion facilement accessibles. Bien sûr, c'était avant que l'idée de navigation privée qui commence à être présenté dans IE8, FF3.1, etc. Même si, de nombreux médecins sont forcés d'utiliser de vieux navigateurs scolaires dans les hôpitaux avec elle qui ne changera pas.

ainsi, nous avons eu la page de connexion générer des noms de champ aléatoires qui ne fonctionneraient que pour ce poste. Oui, c'est moins pratique, mais c'est juste frapper l'utilisateur sur la tête à propos de ne pas stocker les informations de connexion sur les terminaux publics.

16
répondu Jon Adams 2008-09-16 19:35:02
la source

je pense que autocomplete=off est supporté en HTML 5.

Demandez-vous pourquoi vous voulez faire cela, bien qu'il peut faire sens dans certaines situations, mais ne pas le faire juste pour le plaisir de le faire.

c'est moins pratique pour les utilisateurs et pas même un problème de sécurité dans OS X (mentionné par Soren ci-dessous). Si vous êtes inquiet que les gens aient leurs mots de passe volés à distance - un enregistreur de frappe pourrait toujours le faire même si votre application utilise autcomplete=off .

comme un utilisateur qui choisit d'avoir un navigateur se souviennent (la plupart) de mes informations, je le trouverais ennuyeux si votre site ne se souvient pas de la mienne.

16
répondu user631300 2012-08-02 05:14:13
la source

Aucune des solutions n'a fonctionné pour moi dans cette conversation.

j'ai finalement trouvé un solution HTML pure qui nécessite pas de Javascript , fonctionne dans les navigateurs modernes (sauf IE; il fallait au moins 1 prise, non?), et ne vous oblige pas à désactiver autocomplete pour l'ensemble du formulaire.

il suffit de désactiver autocomplete sur le form et ensuite l'allumer pour n'importe quel input que vous souhaitez il pour travailler au sein de la forme. Par exemple:

<form autocomplete="off">
    <!-- these inputs will not allow autocomplete and chrome 
         won't highlight them yellow! -->
    <input name="username"  />
    <input name="password" type="password" />
    <!-- this field will allow autocomplete to work even 
         though we've disabled it on the form -->
    <input name="another_field" autocomplete="on" />
</form>
16
répondu lifo 2013-08-15 23:02:55
la source

était une façon non-standard de faire cela (je pense que Mozilla et Internet Explorer le soutiennent toujours), mais jouer avec les attentes des utilisateurs est une mauvaise idée.

si l'utilisateur entre les détails de sa carte de crédit dans un formulaire et puis laisser quelqu'un d'autre utiliser ce navigateur, ce n'est pas votre problème. :)

14
répondu sparkes 2018-01-06 13:54:21
la source

ça me va.

<input name="pass" type="password" autocomplete="new-password" />

nous pouvons également utiliser cette stratégie dans d'autres contrôles comme le texte, sélectionner etc

11
répondu Muhammad Awais 2018-03-03 10:34:07
la source

ajouter le

autocomplete="off"

à la balise du formulaire désactivera le navigateur autocomplete (ce qui a été précédemment tapé dans ce champ) de tous les champs input dans ce formulaire particulier.

testé le:

  • Firefox 3.5, 4 BETA
  • Internet Explorer 8
  • Chrome
10
répondu Hash 2012-08-02 13:26:21
la source

afin d'éviter le XHTML invalide, vous pouvez définir cet attribut en utilisant javascript. Exemple d'utilisation de jQuery:

<input type="text" class="noAutoComplete" ... />

$(function() {
    $('.noAutoComplete').attr('autocomplete', 'off');
});

le problème est que les utilisateurs sans javascript obtiendront la fonctionnalité autocomplete.

9
répondu cherouvim 2010-12-12 21:34:38
la source

ajouter autocomplete="off" ne suffira pas.

modifier l'attribut "type d'entrée" en type="search" .

Google ne s'applique pas auto-remplir aux entrées avec un type de recherche.

9
répondu Matas Vaitkevicius 2015-10-28 19:32:06
la source

un peu tard pour le match...mais j'ai juste couru dans ce problème et essayé plusieurs échecs, mais celui-ci fonctionne pour moi trouvé sur MDN

dans certains cas, le navigateur continuera de suggérer des valeurs d'autocomplétion même si l'attribut autocomplete est réglé sur off. Cette inattendue le comportement peut être assez déroutant pour les développeurs. Le truc vraiment force la non-completion est d'assigner une chaîne aléatoire à l'attribut comme :

autocomplete="nope"
9
répondu AAH-Shoot 2016-03-22 22:38:37
la source

utilisez un nom et un id non standard pour les champs, donc plutôt que" nom "ayez"name_". Les navigateurs ne verront alors pas qu'il s'agit du champ name. La meilleure partie à ce sujet est que vous pouvez faire cela à certains, mais pas tous les champs et il sera autocomplete certains, mais pas tous les champs.

8
répondu Teifion 2008-08-05 20:27:39
la source

essayez ceux-ci aussi si juste autocomplete="off" ne fonctionne pas:

autocorrect="off" autocapitalize="off" autocomplete="off"
8
répondu jeff 2012-12-04 22:45:43
la source

Je ne peux pas croire que ce soit encore un problème si longtemps après qu'il ait été signalé. Les solutions ci-dessus ne fonctionnaient pas pour moi, comme safari semblait savoir quand l'élément n'était pas affiché ou hors écran, cependant les suivantes ont fonctionné pour moi:

<div style="height:0px; overflow:hidden; ">
  Username <input type="text" name="fake_safari_username" >
  Password <input type="password" name="fake_safari_password">
</div>

j'Espère que c'est utile pour quelqu'un!

8
répondu Ben 2016-04-23 14:02:11
la source

il s'agit d'un problème de sécurité que les navigateurs ignorent maintenant. Les navigateurs identifient et stockent le contenu en utilisant des noms d'entrée, même si les développeurs considèrent que l'information est sensible et ne doit pas être stockée. Faire un nom d'entrée différent entre 2 requêtes résoudra le problème (mais sera quand même sauvegardé dans le cache du navigateur et augmentera également le cache du navigateur). Demander à l'utilisateur d'activer ou de désactiver les options de son navigateur n'est pas une bonne solution. Le problème peut être résolu dans le backend.

voilà ma solution. Une approche que j'ai mise en œuvre dans mon cadre. Tous les éléments autocomplete sont générés avec une entrée cachée comme ceci:

<? $r = rmd5(rand().mocrotime(TRUE)); ?>
<form method="POST" action="./">
    <input type="text" name="<? echo $r; ?>" />
    <input type="hidden" name="__autocomplete_fix_<? echo $r; ?>" value="username" />
    <input type="submit" name="submit" value="submit" />
</form>

Serveur de processus variables post comme ceci :

foreach ($_POST as $key => $val)
{
    if(preg_match('#^__autocomplete_fix_#', $key) === 1){
        $n = substr($key, 19);
        if(isset($_POST[$n]))$_POST[$val] = $_POST[$n];
    }
}

La valeur peut être consulté comme d'habitude

var_dump($_POST['username']);

et le navigateur ne sera pas en mesure de suggérer des informations provenant de la demande précédente ou des utilisateurs précédents.

Tout fonctionne comme un charme, même si les navigateurs mises à jour, veulent ignorer autocomplete ou non. Qui a été la meilleure façon de résoudre le problème pour moi.

8
répondu Simmoniz 2018-01-24 22:33:38
la source

la meilleure solution:

empêcher autocomplete username (ou email) et mot de passe:

<input type="email" name="email"><!-- Can be type="text" -->
<input type="password" name="password" autocomplete="new-password">

Empêcher la saisie semi-automatique d'un champ:

<input type="text" name="field" autocomplete="nope">

explication: autocomplete continue le travail dans <input> , autocomplete="off" ne fonctionne pas, mais vous pouvez changer off à une chaîne aléatoire, comme nope .

Travaille:

  • Chrome: 49, 50, 51, 52, 53, 54, 55, 56, 57, 58, 59, 60, 61, 62, 63 et 64

  • Firefox: 44, 45, 46, 47, 48, 49, 50, 51, 52, 53, 54, 55, 56, 57 et 58

8
répondu Cava 2018-03-20 07:31:56
la source

aucun des hacks mentionnés ici ne fonctionnait pour moi en Chrome. Il y a une discussion sur la question ici: https://code.google.com/p/chromium/issues/detail?id=468153#c41

ajouter ce à l'intérieur d'un <form> travaux (au moins pour l'instant):

<div style="display: none;">
    <input type="text" id="PreventChromeAutocomplete" name="PreventChromeAutocomplete" autocomplete="address-level4" />
</div>
7
répondu Jakob Løkke Madsen 2015-07-02 13:40:19
la source

essayer d'ajouter

readonly onfocus= " this.removeAttribute ('readonly'); "

en plus de

autocomplete= "off"

à l'entrée ou aux entrées que vous ne voulez pas mémoriser les données du formulaire ( username , password , etc.) comme indiqué ci-après:

<input type="text" name="UserName" autocomplete="off" readonly 
    onfocus="this.removeAttribute('readonly');" >

<input type="password" name="Password" autocomplete="off" readonly 
    onfocus="this.removeAttribute('readonly');" >

Testé sur les dernières versions des principaux navigateurs c'est à dire Google Chrome , Mozilla Firefox , Microsoft Edge , etc. et de travail sans aucun problème. Espérons que cette aide...

6
répondu Murat Yıldız 2017-11-01 16:26:43
la source

Vous pouvez utiliser en entrée.

par exemple;

<input type=text name="test" autocomplete="off" />
5
répondu xxxxx 2012-11-02 21:00:44
la source

alors voilà:

function turnOnPasswordStyle() {
  $('#inputpassword').attr('type', "password");
}
<input oninput="turnOnPasswordStyle()" id="inputpassword" type="text">
5
répondu Stav Bodik 2017-07-20 20:07:20
la source

Autres questions sur html browser autocomplete