Chrome ignoriert automatische Vervollständigung = “aus”

Ich habe eine Webanwendung erstellt, die ein Tagbox-Dropdown verwendet. Dies funktioniert in allen Browsern mit Ausnahme des Chrome-Browsers (Version 21.0.1180.89).

Trotz der beiden input UND des form mit dem Attribut autocomplete="off" besteht Chrome darauf, einen Drop-down-Verlauf früherer Einträge für das Feld anzuzeigen, wodurch die Tagbox-Liste gelöscht wird.

   

AKTUALISIEREN

Es scheint jetzt Chrome ignoriert den style="display: none;" oder style="visibility: hidden; Attribute.

Sie können es wie folgt ändern:

   

Meiner Erfahrung nach verifiziert Chrome nur das erste und das vorherige . Also habe ich hinzugefügt:

   

An den Anfang des

und der Fall wurde aufgetriggers.

Verhindern Sie die automatische Vervollständigung des Benutzernamens (oder der E-Mail-Adresse) und des Passworts:

   

Verhindern, dass ein Feld automatisch vervollständigt wird ( funktioniert möglicherweise nicht ):

  

Erläuterung:

autocomplete funktioniert immer noch auf obwohl autocomplete="off" , aber Sie können auf eine zufällige Zeichenfolge wie nope .


Andere “Lösungen” zum Deaktivieren der automatischen Vervollständigung eines Feldes (es ist nicht der richtige Weg, es zu tun, aber es funktioniert):

1.

HTML:

  

JS (onload):

 (function() { var some_id = document.getElementById('some_id'); some_id.type = 'text'; some_id.removeAttribute('autocomplete'); })(); 

oder mit jQuery:

 $(document).ready(function() { var some_id = $('#some_id'); some_id.prop('type', 'text'); some_id.removeAttr('autocomplete'); }); 

2.

HTML:

 

JS (onload):

 (function() { var input = document.createElement('INPUT'); input.type = 'text'; document.getElementById('form').appendChild(input); })(); 

oder mit jQuery:

 $(document).ready(function() { $('', { type: 'text' }).appendTo($('#form')); }); 

So fügen Sie mit jQuery mehr als ein Feld hinzu:

 function addField(label) { var div = $('
'); var input = $('', { type: 'text' }); if(label) { var label = $('
  

Scheint, dass Chrome jetzt autocomplete="off" ignoriert, es sei denn, es befindet sich im Tag

.

Für eine zuverlässige Problemumgehung können Sie diesen Code zu Ihrer Layoutseite hinzufügen:

 

Chrome respektiert autocomplete = off nur dann, wenn mindestens ein anderes Eingabeelement im Formular mit einem anderen Autocomplete-Wert vorhanden ist.

Dies funktioniert nicht mit Passwortfeldern – diese werden in Chrome sehr unterschiedlich gehandhabt. Weitere Informationen finden Sie unter https://code.google.com/p/chromium/issues/detail?id=468153 .

UPDATE: Fehler geschlossen als “Wird nicht behoben” von Chromium Team 11. März 2016. Siehe letzten Kommentar in meinem ursprünglich eingereichten Fehlerbericht , für eine vollständige Erklärung. TL; DR: Verwenden Sie semantische Autocomplete-Attribute wie autocomplete = “new-street-address”, um zu vermeiden, dass Chrome automatisch ausgefüllt wird.

Moderner Ansatz

readonly Ihre Eingabe readonly und nur im Fokus, entfernen Sie sie. Dies ist ein sehr einfacher Ansatz und Browser readonly keine readonly Eingaben. Daher wird diese Methode akzeptiert und wird niemals durch zukünftige Browser-Updates überschrieben.

  

readonly Sie Ihre Eingabe entsprechend, sodass sie nicht wie eine readonly Eingabe readonly

 input[readonly] { cursor: text; background-color: #fff; } 

Arbeitsbeispiel

Chrome Version 34 ignoriert jetzt die autocomplete=off , siehe hier .

Viele Diskussionen darüber, ob dies eine gute Sache oder eine schlechte Sache ist? Was sind deine Ansichten?

Die Lösung besteht derzeit in type="search" . Google wendet AutoFill nicht auf Eingaben mit einem Suchtyp an.

Siehe: https://twitter.com/Paul_Kinlan/status/596613148985171968

Update 04.04.2016: Sieht so aus als wäre das behoben! Siehe http://codereview.chromium.org/1473733008

Nun, ein bisschen spät zur Party, aber es scheint, dass es ein bisschen Missverständnis darüber gibt, wie autocomplete funktionieren soll und was nicht. Gemäß den HTML-Spezifikationen kann der Benutzeragent (in diesem Fall Chrome) die autocomplete außer Kraft setzen:

https://www.w3.org/TR/html5/forms.html#autofilling-form-controls:-the-autocomplete-attribute

Ein Benutzeragent kann dem Benutzer erlauben, den AutoFill-Feldnamen eines Elements zu überschreiben, z. B. von “Aus” auf “Ein”, damit Werte trotz der Einwände des Seitenautors gespeichert und vorgefüllt werden können oder immer “aus” sind und sich nie erinnern Werte. Benutzeragenten sollten Benutzern jedoch nicht erlauben, den Namen des AutoFill-Felds leicht von “Aus” auf “Ein” oder andere Werte zu überschreiben, da für den Benutzer erhebliche Sicherheitsbedeutungen bestehen, wenn alle Werte unabhängig von den Voreinstellungen der Site immer gespeichert werden.

Im Fall von Chrome haben die Entwickler im Wesentlichen gesagt: “Wir überlassen es dem Benutzer, in seinen Einstellungen zu entscheiden, ob die autocomplete funktionieren soll oder nicht. Wenn Sie das nicht möchten, aktivieren Sie es nicht in Ihrem Browser “.

Es scheint jedoch, dass dies ein bisschen übereifrig ist, aber es ist so, wie es ist. In der Spezifikation werden auch die möglichen Auswirkungen eines solchen Schritts auf die Sicherheit erörtert:

Das Schlüsselwort “off” zeigt an, dass die Eingabedaten des Steuerelements besonders empfindlich sind (z. B. der Aktivierungscode für eine Atomwaffe). oder dass es ein Wert ist, der niemals wiederverwendet wird (zum Beispiel ein Einmalschlüssel für eine Bankanmeldung) und der Benutzer muss daher die Daten jedes Mal explizit eingeben, anstatt sich darauf verlassen zu können, dass der UA vorausfährt der Wert für ihn; oder dass das Dokument seinen eigenen Autocomplete-Mechanismus bereitstellt und nicht möchte, dass der Benutzeragent Autokomplettierungswerte bereitstellt.

Nachdem ich die gleiche Frustration wie alle anderen erlebt hatte, fand ich eine Lösung, die für mich funktioniert. Es ist ähnlich wie autocomplete="false" Antworten.

Ein Mozilla-Artikel spricht genau dieses Problem an:

https://developer.mozilla.org/en-US/docs/Web/Security/Securing_your_site/Turning_off_form_autocompletion

In einigen Fällen schlägt der Browser Autovervollständigungswerte vor, auch wenn das Autocomplete-Attribut deaktiviert ist. Dieses unerwartete Verhalten kann für Entwickler ziemlich verwirrend sein. Der Trick, um die Nicht-Vervollständigung wirklich zu erzwingen, besteht darin, dem Attribut eine zufällige Zeichenfolge zuzuweisen

Also sollte der folgende Code funktionieren:

 autocomplete="nope" 

Und so sollte jeder der folgenden:

 autocomplete="false" autocomplete="foo" autocomplete="bar" 

Das Problem, das ich sehe, ist, dass der Browser-Agent intelligent genug sein könnte, um das autocomplete Attribut zu lernen und es das nächste Mal anzuwenden, wenn es das Formular sieht. Wenn dies der Fall ist, kann ich das Problem nur dann autocomplete , wenn ich den Attributwert für die autocomplete dynamisch ändere, wenn die Seite generiert wird.

Ein erwähnenswerter Punkt ist, dass viele Browser autocomplete für Login-Felder (Benutzername und Passwort) ignorieren. Wie der Mozilla-Artikel sagt:

Aus diesem Grund unterstützen viele moderne Browser Autocomplete = “off” für Login-Felder nicht.

  • Wenn eine Website autocomplete = “off” für ein Formular einstellt und das Formular Benutzernamen und Passworteingabefelder enthält, bietet der Browser weiterhin an, sich an diesen Login zu erinnern, und wenn der Benutzer dem zustimmt, füllt der Browser diese Felder beim nächsten Mal automatisch aus Benutzer besucht diese Seite.
  • Wenn eine Website autocomplete = “off” für die Eingabefelder Benutzername und Passwort einstellt, bietet der Browser weiterhin an, sich an diese Anmeldung zu erinnern, und wenn der Benutzer dem zustimmt, füllt der Browser diese Felder beim nächsten Besuch der Seite automatisch aus.

Dies ist das Verhalten in Firefox (seit Version 38), Google Chrome (seit 34) und Internet Explorer (seit Version 11).

Abschließend noch ein wenig darüber, ob das Attribut zum form oder zum input . Die Spezifikation hat wieder die Antwort:

Wenn das Autocomplete-Attribut nicht angegeben wird, wird stattdessen der Standardwert verwendet, der dem Status des Autovervollständigungsattributs des Formulars entspricht (entweder “Ein” oder “Aus”). Wenn kein Formularbesitzer vorhanden ist, wird der Wert “on” verwendet.

Damit. Das Formular sollte für alle Eingabefelder gelten. Das Setzen auf ein einzelnes Element sollte nur für dieses Element gelten (auch wenn es keins auf dem Formular gibt). Wenn die autocomplete nicht festgelegt ist, ist sie standardmäßig aktiviert.

Zusammenfassung

So deaktivieren Sie die autocomplete für das gesamte Formular:

 

Oder wenn Sie es dynamisch tun müssen:

 

So deaktivieren Sie die autocomplete für ein einzelnes Element (unabhängig davon, autocomplete die Formulareinstellung vorhanden ist oder nicht)

  

Oder wenn Sie es dynamisch tun müssen:

  

Und denken Sie daran, dass bestimmte Benutzeragenten auch Ihre am härtesten geführten Versuche, die autocomplete zu deaktivieren, außer Kraft setzen können.

Der Browser kümmert sich nicht um Autocomplete = aus Auto oder füllt sogar Anmeldeinformationen in falsches Textfeld?

Ich habe es behoben, indem ich das Passwort-Feld schreibgeschützt gesetzt habe und es aktiviert habe, wenn der Benutzer darauf klickt oder Tab-Taste in dieses Feld drückt.

Browser-Autofill in: readonly fixieren und Writeble auf den Fokus setzen (beim Mausklick und durch Tabs durch die Felder)

   

Update: Mobile Safari setzt den Cursor in das Feld, zeigt jedoch keine virtuelle Tastatur an. New Fix funktioniert wie zuvor, behandelt aber die virtuelle Tastatur:

  

Live-Demo https://jsfiddle.net/danielsueß/n0scguv6/

// UpdateEnd

Übrigens, mehr Informationen zu meiner Beobachtung:

Manchmal bemerke ich dieses merkwürdige Verhalten in Chrome und Safari, wenn es Passwortfelder in der gleichen Form gibt. Ich denke, der Browser sucht nach einem Passwortfeld, um Ihre gespeicherten Zugangsdaten einzugeben. Dann wird der Benutzername automatisch in das nächste Eingabefeld eingegeben, das vor dem Passwortfeld in DOM erscheint (nur durch Beobachtung). Da der Browser die letzte Instanz ist und Sie ihn nicht steuern können, würde manchmal sogar die automatische Vervollständigung = off nicht verhindern, dass die Anmeldeinformationen in falsche Felder eingegeben werden, aber nicht in das Benutzer- oder Nickname-Feld.

Du kannst autocomplete="new-password"

   

Arbeitet in:

  • Chrom: 53, 54, 55
  • Firefox: 48, 49, 50

Jedem, der nach einer Lösung sucht, finde ich es endlich heraus.

Chrome gehorche nur der Autocomplete = “aus” wenn die Seite eine HTML5 Seite ist (ich habe XHTML benutzt).

Ich konvertierte meine Seite in HTML5 und das Problem ging weg (facepalm).

Chrom gesehen ignoriere die autocomplete="off" , ich löse es mit einer dummen Art und Weise, die “fake input” benutzt, um Chrom zu checken, um es zu füllen, anstatt das “echte” zu füllen.

Beispiel:

   

Chrome füllt die “falsche Eingabe” und beim Senden nimmt der Server den Wert “echte Eingabe” an.

Ich poste diese Antwort, um eine aktualisierte Lösung für dieses Problem zu bringen. Ich verwende derzeit Chrome 49 und keine Antwort auf diese Frage. Ich suche auch nach einer Lösung, die mit anderen Browsern und früheren Versionen funktioniert.

Setzen Sie diesen Code an den Anfang Ihres Formulars

 

Verwenden Sie dann für Ihr echtes Passwortfeld

  

Kommentiere diese Antwort, wenn diese nicht mehr funktioniert oder wenn du ein Problem mit einem anderen Browser oder einer anderen Version bekommst.

Genehmigt am:

  • Chrome: 49
  • Firefox: 44, 45
  • Rand: 25
  • Internet Explorer: 11

Bis zu dieser letzten Woche schienen die beiden folgenden Lösungen für Chrome, IE und Firefox zu funktionieren. Aber mit der Veröffentlichung der Chrome-Version 48 (und immer noch in 49) funktionieren sie nicht mehr:

  1. Das Folgende am Anfang des Formulars:
   
  1. Folgendes im Passworteingabeelement:

    Autovervollständigung = “aus”

Um dies schnell zu beheben, versuchte ich zuerst, einen großen Hack zu verwenden, indem ich anfänglich das Passworteingabeelement auf disabled stellte und dann setTimeout in der Document Ready-function verwendete, um es wieder zu aktivieren.

 setTimeout(function(){$('#PasswordData').prop('disabled', false);}, 50); 

Aber das schien so verrückt zu sein und ich habe ein wenig mehr gesucht und @tibalts Antwort in Deaktivierung von Chrome AutoFill gefunden . Seine Antwort ist, autocomplete = “new-password” in den Passwörtern zu verwenden und dies scheint auf allen Browsern zu funktionieren (ich habe meine Fixnummer 1 oben in diesem Stadium behalten).

Hier ist der Link in der Google Chrome-Entwicklerdiskussion: https://code.google.com/p/chromium/issues/detail?id=370363#c7

Anstelle von Autocomplete = “off” benutze autocomplete = “false” 😉

von: https://Stackoverflow.com/a/29582380/75799

autocomplete=off wird in modernen Browsern weitgehend ignoriert – hauptsächlich aufgrund von Passwortmanagern usw.

Sie können versuchen, dieses autocomplete="new-password" hinzuzufügen, es wird nicht vollständig von allen Browsern unterstützt, aber es funktioniert bei einigen

Ab Chrome 42 2015-05-21T12:50:23+00:00 keine Lösungen / Hacks in diesem Thread (Stand 2015-05-21T12:50:23+00:00 ) zum Deaktivieren der automatischen Vervollständigung für ein einzelnes Feld oder das gesamte Formular.

EDIT: Ich habe festgestellt, dass Sie tatsächlich nur ein Dummy-E-Mail-Feld in Ihr Formular einfügen müssen (Sie können es mit display: none ausblenden display: none ) vor den anderen Feldern, um Autovervollständigung zu verhindern. Ich nehme an, dass chrome eine Art Formularsignatur für jedes automatisch verarbeitete Feld speichert und ein anderes E-Mail-Feld enthält, das diese Signatur beschädigt und die automatische Vervollständigung verhindert.

 

Die gute Nachricht ist, dass, da die “Formularsignatur” dadurch beschädigt wird, keines der Felder automatisch vervollständigt wird, so dass kein JS benötigt wird, um die gefälschten Felder vor der Einreichung zu löschen.

Alte Antwort:

Das einzige, was ich noch als praktikabel empfinde, ist, zwei Dummy-Felder vom Typ E-Mail und Passwort vor den echten Feldern einzufügen. Sie können sie so einstellen, dass sie display: none , um sie auszublenden (es ist nicht schlau genug, diese Felder zu ignorieren):

 

Leider müssen die Felder in Ihrer Form sein (andernfalls werden beide Sätze von Eingaben automatisch ausgefüllt). Damit die falschen Felder wirklich ignoriert werden, benötigen Sie ein JS, das auf dem Formular “Senden” ausgeführt wird, um sie zu löschen:

 form.addEventListener('submit', function() { form.elements['fake_email'].value = ''; form.elements['fake_password'].value = ''; }); 

Beachten Sie, dass das Löschen des Werts mit Javascript dazu führt, dass die automatische Vervollständigung überschrieben wird. Wenn das richtige Verhalten mit JS deaktiviert ist, können Sie dies mit einem JS-Autocomplete-Polyfill für Chrome vereinfachen:

 (function(document) { function polyfillAutocomplete(nodes) { for(var i = 0, length = nodes.length; i < length; i++) { if(nodes[i].getAttribute('autocomplete') === 'off') { nodes[i].value = ''; } } } setTimeout(function() { polyfillAutocomplete(document.getElementsByTagName('input')); polyfillAutocomplete(document.getElementsByTagName('textarea')); }, 1); })(window.document); 

Nach dem Chrome v. 34 funktioniert das Setzen von autocomplete="off" am

-Tag nicht

Ich habe die Änderungen vorgenommen, um dieses lästige Verhalten zu vermeiden:

  1. Entfernen Sie den name und die id der Passworteingabe
  2. Schreiben Sie eine class in die Eingabe (zB passwordInput )

(Bis jetzt wird Chrome das gespeicherte Passwort nicht auf die Eingabe übertragen, aber das Formular ist jetzt defekt)

Um das Formular funktionsfähig zu machen, müssen Sie diesen Code ausführen, wenn der Benutzer auf die Schaltfläche zum Senden klickt oder wenn Sie die Formularübermittlung auslösen möchten:

 var sI = $(".passwordInput")[0]; $(sI).attr("id", "password"); $(sI).attr("name", "password"); 

In meinem Fall hatte ich id="password" name="password" in der Passwort-Eingabe, so dass ich sie zurückstellen, bevor die Submission auslösen.

Ändern Sie das Eingabetypattribut in type="search" .

Google wendet die automatische Füllung nicht auf Eingaben mit einem Suchtyp an.

Ich habe gerade auf Chrome 49 aktualisiert und die Lösung von Diogo Cid funktioniert nicht mehr.

Ich habe eine andere Problemumgehung gemacht, um die Felder zur Laufzeit nach dem Laden der Seite auszublenden und zu entfernen.

Chrome ignoriert jetzt die ursprüngliche Problemumgehung, bei der die Anmeldeinformationen auf das erste angezeigte Feld type="password" und das vorherige Feld type="text" angewendet werden. Daher habe ich beide Felder mithilfe der CSS- visibility: hidden;

  
.chromeHack-autocomplete { height: 0px !important; width: 0px !important; opacity: 0 !important; padding: 0 !important; margin: 0 !important; } jQuery(window).load(function() { $(".chromeHack-autocomplete").delay(100).hide(0, function() { $(this).remove(); }); });

Ich weiß, dass es nicht sehr elegant aussieht, aber es funktioniert.

In Chrome 48+ verwenden Sie diese Lösung:

  1. Setzen Sie falsche Felder vor echte Felder:

     
  2. Falsche Felder ausblenden:

     .visually-hidden { margin: -1px; padding: 0; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip: rect(0, 0, 0, 0); position: absolute; } 
  3. Du hast es geschafft!

Dies funktioniert auch für ältere Versionen.

Ich fand diese Lösung am besten geeignet:

 function clearChromeAutocomplete() { // not possible, let's try: if (navigator.userAgent.toLowerCase().indexOf('chrome') >= 0) { document.getElementById('adminForm').setAttribute('autocomplete', 'off'); setTimeout(function () { document.getElementById('adminForm').setAttribute('autocomplete', 'on'); }, 1500); } } 

Sie muss nach dom ready oder nach dem Rendern des Formulars geladen werden.

Während ich der automatischen Vervollständigung zustimme, sollte eine Benutzerwahl sein, es gibt Zeiten, in denen Chrome übereifrig damit ist (andere Browser mögen das auch). Beispielsweise wird ein Kennwortfeld mit einem anderen Namen automatisch mit einem gespeicherten Kennwort ausgefüllt, und das vorherige Feld wird mit dem Benutzernamen ausgefüllt. Dies ist besonders ärgerlich, wenn das Formular ein Benutzerverwaltungsformular für eine Webanwendung ist und Sie nicht möchten, dass AutoFill es mit Ihren eigenen Anmeldeinformationen füllt.

Chrome ignoriert Autocomplete = “off” jetzt vollständig. Während die JS Hacks gut funktionieren könnten, habe ich einen einfachen Weg gefunden, der zum Zeitpunkt des Schreibens funktioniert:

Setzen Sie den Wert des Passwortfeldes auf das Steuerzeichen 8 ( "\x08" in PHP oder  in HTML). Dadurch wird das automatische Ausfüllen des Felds durch Chrome gestoppt, da es einen Wert enthält, aber kein tatsächlicher Wert eingegeben wird, da dies das Backspace-Zeichen ist.

Ja, das ist immer noch ein Hack, aber es funktioniert für mich. YMMV.

Ich habe es anders getriggers. Du kannst es versuchen.

   

Nachdem Sie alle Lösungen ausprobiert haben, scheint hier für Chrome-Version zu arbeiten: 45, mit Formular mit Passwort-Feld:

  jQuery('document').ready(function(){ //For disabling Chrome Autocomplete jQuery( ":text" ).attr('autocomplete','pre'+Math.random(0,100000000)); }); 

Der Trick mit dem verborgenen Eingabeelement scheint immer noch zu funktionieren (Chrome 43), um das automatische Ausfüllen zu verhindern. Beachten Sie jedoch, dass Chrome versucht, basierend auf dem Platzhaltertag automatisch zu füllen. Sie müssen den Platzhalter des ausgeblendeten Eingabeelements dem der Eingabe anpassen, die Sie deaktivieren möchten.

In meinem Fall hatte ich ein Feld mit einem Platzhaltertext von “City or Zip”, den ich mit Google Place Autocomplete verwendete. Es schien, dass es versuchte, automatisch zu füllen, als ob es Teil eines Adressformulars wäre. Der Trick funktionierte nicht, bis ich den gleichen Platzhalter auf das versteckte Element gesetzt habe wie auf den realen Input:

   

I had a similar issue where the input field took either a name or an email. I set autocomplete=”off” but Chrome still forced suggestions. Turns out it was because the placeholder text had the words “name” and “email” in it.

Beispielsweise

  

I got around it by putting a zero width space into the words in the placeholder. No more Chrome autocomplete.

  

Looks like this is fixed! See https://codereview.chromium.org/1473733008

When using a widget like jQuery UI’s Autocomplete make sure to check that it is not adding/changing to autocomplete attribute to off. I found this to be true when using it and will break any work you may have done to override any browser field caching. Make certain that you have a unique name attribute and force a unique autocomplete attribute after the widget initializes. See below for some hints on how that might work for your situation.

 < ?php $autocomplete = 'off_'.time(); ?>   

I’ve solved the endless fight with Google Chrome with the use of random characters.

  

Hope that it will help to other people.