Wie deaktivieren Sie autocomplete
in den wichtigsten Browsern für eine bestimmte input
(oder form field
)?
Wie deaktivieren Sie autocomplete
in den wichtigsten Browsern für eine bestimmte input
(oder form field
)?
Antworten:
Firefox 30 ignoriert autocomplete="off"
Kennwörter und fragt stattdessen den Benutzer, ob das Kennwort auf dem Client gespeichert werden soll. Beachten Sie den folgenden Kommentar vom 5. Mai 2014:
- Der Passwort-Manager fordert immer auf, ein Passwort zu speichern. Passwörter werden nicht ohne Erlaubnis des Benutzers gespeichert.
- Nach IE und Chrome sind wir der dritte Browser, der diese Änderung implementiert.
Gemäß der Dokumentation zum Mozilla Developer Networkautocomplete
verhindert das boolesche Formularelementattribut, dass Formulardaten in älteren Browsern zwischengespeichert werden.
<input type="text" name="foo" autocomplete="off" />
Darüber hinaus autocomplete=off
können Sie die Namen Ihrer Formularfelder durch den Code, der die Seite generiert, zufällig sortieren lassen, indem Sie möglicherweise am Ende der Namen eine sitzungsspezifische Zeichenfolge hinzufügen.
Wenn das Formular gesendet wird, können Sie diesen Teil entfernen, bevor Sie ihn auf der Serverseite verarbeiten. Dies würde verhindern, dass der Webbrowser den Kontext für Ihr Feld findet, und könnte auch dazu beitragen, XSRF-Angriffe zu verhindern, da ein Angreifer die Feldnamen für eine Formularübermittlung nicht erraten kann.
$_SESSION['codefield_name'] = md5(uniqid('auth', true));
Die meisten gängigen Browser und Passwortmanager (IMHO) ignorieren dies jetzt autocomplete=off
.
Warum? Viele Banken und andere "Hochsicherheits" -Websites haben autocomplete=off
ihre Anmeldeseiten "aus Sicherheitsgründen" hinzugefügt. Dies verringert jedoch die Sicherheit, da die Kennwörter auf diesen Hochsicherheits-Websites seit der automatischen Vervollständigung leicht zu merken (und damit zu knacken) sind war kaputt.
Vor langer Zeit haben die meisten Passwortmanager angefangen, dies zu ignorieren autocomplete=off
, und jetzt beginnen die Browser, dasselbe nur für die Eingabe von Benutzernamen / Passwörtern zu tun.
Leider fügen Fehler in den Implementierungen zur automatischen Vervollständigung Benutzernamen- und / oder Kennwortinformationen in unangemessene Formularfelder ein, was zu Fehlern bei der Formularüberprüfung führt, oder noch schlimmer, indem versehentlich Benutzernamen in Felder eingefügt werden, die vom Benutzer absichtlich leer gelassen wurden.
Was kann ein Webentwickler tun?
Chrome 34 versucht leider, Felder mit Benutzer / Pass automatisch auszufüllen, wenn ein Kennwortfeld angezeigt wird. Dies ist ein ziemlich schlimmer Fehler, der hoffentlich das Safari-Verhalten ändern wird. Wenn Sie dies jedoch oben in Ihrem Formular hinzufügen, wird das automatische Ausfüllen des Kennworts anscheinend deaktiviert:
<input type="text" style="display:none">
<input type="password" style="display:none">
Ich habe IE oder Firefox noch nicht gründlich untersucht, werde aber gerne die Antwort aktualisieren, wenn andere Informationen in den Kommentaren haben.
type='password'
Feldern auf einer Seite führte dazu, dass die automatische Vervollständigung des Browsers "Passwort speichern" ignoriert wurde. Dies war sehr sinnvoll, da Registrierungsformulare das Passwort in der Regel zweimal anfordern, wenn Anmeldeformulare nur einmal danach fragen.
Manchmal = sogar die automatische Vervollständigung ausgeschaltet würde verhindern , nicht zu füllen Anmeldeinformationen in falsche Felder, aber nicht vom Benutzer oder Spitznamen Feld.
Diese Problemumgehung ist zusätzlich zu Apinsteins Beitrag zum Browserverhalten.
Korrigieren Sie das automatische Ausfüllen des Browsers für schreibgeschützt und setzen Sie die Beschreibbarkeit auf den Fokus (Klicken und Tabulator).
<input type="password" readonly
onfocus="this.removeAttribute('readonly');"/>
Update: Mobile Safari setzt den Cursor in das Feld, zeigt jedoch keine virtuelle Tastatur an. New Fix funktioniert wie zuvor, behandelt jedoch die virtuelle Tastatur:
<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
Weil der Browser die Anmeldeinformationen automatisch in ein falsches Textfeld ausfüllt!?
Ich bemerke dieses seltsame Verhalten in Chrome und Safari, wenn Kennwortfelder in derselben Form vorhanden sind. Ich denke, der Browser sucht nach einem Passwortfeld, um Ihre gespeicherten Anmeldeinformationen einzufügen. Dann wird das nächste Texteingabefeld, das vor dem Kennwortfeld im DOM angezeigt wird, automatisch ausgefüllt (nur aufgrund von Beobachtungen erraten). Da der Browser die letzte Instanz ist und Sie sie nicht steuern können,
Dieser Readonly-Fix oben hat bei mir funktioniert.
readonly
entfernt wird, führt die nachfolgende Auswahl des Feldes zur automatischen Vervollständigung.
<form name="form1" id="form1" method="post"
autocomplete="off" action="http://www.example.com/form.cgi">
Dies funktioniert in Internet Explorer und Mozilla FireFox. Der Nachteil ist, dass es kein XHTML-Standard ist.
input type="password"
. Hoffentlich entfernen keine anderen Browser diese Funktionalität.
autocomplete="off"
auf form
ist das einzige, was für Chrome funktioniert hat.
Die Lösung für Chrome besteht darin autocomplete="new-password"
, dem Eingabetyp ein Kennwort hinzuzufügen . Bitte überprüfen Sie das Beispiel unten.
Beispiel:
<form name="myForm"" method="post">
<input name="user" type="text" />
<input name="pass" type="password" autocomplete="new-password" />
<input type="submit">
</form>
Chrome vervollständigt die Daten immer automatisch, wenn ein Feld vom Typ Kennwort gefunden wird , das gerade ausreicht, um dieses Feld anzugeben autocomplete = "new-password"
.
Das funktioniert gut für mich.
Hinweis: Stellen Sie sicher, F12
dass Ihre Änderungen wirksam werden. Oft speichern Browser die Seite im Cache. Dies gab mir den schlechten Eindruck, dass es nicht funktioniert hat, aber der Browser hat die Änderungen nicht tatsächlich übernommen.
Wie andere gesagt haben, lautet die Antwort autocomplete="off"
Ich denke jedoch, es lohnt sich zu erwähnen, warum es in bestimmten Fällen eine gute Idee ist, dies zu verwenden, da einige Antworten darauf und doppelte Fragen darauf hindeuten, dass es besser ist, es nicht auszuschalten.
Das Stoppen von Browsern, in denen Kreditkartennummern gespeichert sind, sollte nicht den Benutzern überlassen bleiben. Zu viele Benutzer werden nicht einmal erkennen, dass es sich um ein Problem handelt.
Es ist besonders wichtig, diese Option in Feldern für Kreditkarten-Sicherheitscodes zu deaktivieren. Wie diese Seite sagt:
"Speichern Sie niemals den Sicherheitscode ... sein Wert hängt von der Annahme ab, dass die einzige Möglichkeit, ihn bereitzustellen, darin besteht, ihn von der physischen Kreditkarte zu lesen, um zu beweisen, dass die Person, die ihn liefert, die Karte tatsächlich besitzt."
Das Problem ist, wenn es sich um einen öffentlichen Computer handelt (Cyber-Café, Bibliothek usw.), können andere Benutzer Ihre Kartendaten leicht stehlen, und selbst auf Ihrem eigenen Computer kann eine böswillige Website Daten zur automatischen Vervollständigung stehlen .
Ich habe den endlosen Kampf mit Google Chrome mit zufälligen Zeichen gelöst. Wenn Sie die automatische Vervollständigung immer mit einer zufälligen Zeichenfolge rendern, wird sie sich nie an etwas erinnern.
<input name="name" type="text" autocomplete="rutjfkde">
Hoffe, dass es anderen Menschen helfen wird.
autocompleteoff
Klasse zu Ihrem gewünschten Eingabefeld hinzufügen .
Ich muss darum bitten, mich von den Antworten zu unterscheiden, die besagen, um zu vermeiden, dass die automatische Vervollständigung deaktiviert wird.
Das erste, was Sie ansprechen müssen, ist, dass die automatische Vervollständigung, die in Anmeldeformularfeldern nicht explizit deaktiviert wird, ein PCI-DSS-Fehler ist. Wenn der lokale Computer eines Benutzers gefährdet ist, kann ein Angreifer alle Daten zur automatischen Vervollständigung trivial abrufen, da sie im Clear gespeichert sind.
Es gibt sicherlich ein Argument für die Benutzerfreundlichkeit, aber es gibt eine sehr gute Balance, wenn es darum geht, welche Formularfelder die automatische Vervollständigung deaktivieren sollen und welche nicht.
Drei Optionen: Erstens:
<input type='text' autocomplete='off' />
Zweite:
<form action='' autocomplete='off'>
Drittens (Javascript-Code):
$('input').attr('autocomplete', 'off');
Auf eine verwandte oder tatsächlich auf die völlig entgegengesetzte Note -
"Wenn Sie der Benutzer des oben genannten Formulars sind und die Autovervollständigungsfunktion wieder aktivieren möchten, verwenden Sie das Lesezeichen" Kennwort speichern "auf dieser Lesezeichenseite . Es entfernt alle
autocomplete="off"
Attribute aus allen Formularen auf der Seite. Kämpfen Sie weiter! ""
Wir haben die Idee von sasb tatsächlich für eine Site verwendet. Es war eine Web-App für medizinische Software, um eine Arztpraxis zu betreiben. Viele unserer Kunden waren jedoch Chirurgen, die viele verschiedene Arbeitsplätze nutzten, einschließlich halböffentlicher Terminals. Sie wollten daher sicherstellen, dass ein Arzt, der die Auswirkungen automatisch gespeicherter Passwörter nicht versteht oder nicht aufpasst, seine Anmeldeinformationen nicht versehentlich leicht zugänglich macht. Dies war natürlich vor der Idee des privaten Browsings, das in IE8, FF3.1 usw. eingeführt wird. Trotzdem sind viele Ärzte gezwungen, Browser der alten Schule in Krankenhäusern mit IT zu verwenden, die sich nicht ändern.
Wir haben also die Anmeldeseite zufällige Feldnamen generieren lassen, die nur für diesen Beitrag funktionieren würden. Ja, es ist weniger praktisch, aber es trifft den Benutzer nur über den Kopf, wenn er keine Anmeldeinformationen auf öffentlichen Terminals speichert.
Keine der Lösungen hat in diesem Gespräch für mich funktioniert.
Ich habe endlich eine reine HTML-Lösung gefunden , die kein Javascript erfordert , in modernen Browsern funktioniert (außer IE; es musste mindestens 1 Fang geben, oder?) Und die automatische Vervollständigung nicht für das gesamte Formular deaktivieren muss.
Deaktivieren Sie einfach die automatische Vervollständigung auf dem form
und schalten Sie sie dann ein, input
wenn Sie möchten, dass sie innerhalb des Formulars funktioniert. Zum Beispiel:
<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>
Einfach einstellen autocomplete="off"
. Dafür gibt es einen sehr guten Grund: Sie möchten Ihre eigene Autocomplete-Funktionalität bereitstellen!
Ich habe endlose Lösungen ausprobiert und dann Folgendes gefunden:
Anstatt autocomplete="off"
einfach nur zu benutzenautocomplete="false"
So einfach ist das und es funktioniert auch in Google Chrome wie ein Zauber!
Das funktioniert bei mir.
<input name="pass" type="password" autocomplete="new-password" />
Wir können diese Strategie auch in anderen Steuerelementen wie Text, Auswahl usw. Verwenden
Ich denke, autocomplete=off
wird in HTML 5 unterstützt.
Fragen Sie sich, warum Sie dies tun möchten - es kann in einigen Situationen sinnvoll sein, aber tun Sie es nicht nur, um es zu tun.
Es ist weniger bequem für Benutzer und nicht einmal ein Sicherheitsproblem in OS X (von Soren unten erwähnt). Wenn Sie sich Sorgen machen, dass Personen ihre Passwörter aus der Ferne gestohlen haben, kann dies ein Tastendruck-Logger auch dann tun, wenn Ihre App dies verwendet autcomplete=off
.
Als Benutzer, der sich dafür entscheidet, dass sich ein Browser (die meisten) meiner Informationen merkt, finde ich es ärgerlich, wenn sich Ihre Website nicht an meine erinnert.
Zusätzlich zu
autocomplete="off"
Verwenden
readonly onfocus="this.removeAttribute('readonly');"
für die Eingaben, an die sie sich keine Formulardaten ( usw.) erinnern username
sollen password
, wie unten gezeigt:
<input type="text" name="UserName" autocomplete="off" readonly
onfocus="this.removeAttribute('readonly');" >
<input type="password" name="Password" autocomplete="off" readonly
onfocus="this.removeAttribute('readonly');" >
Hoffe das hilft.
$(document).on('focus', 'input:password[readonly="readonly"]', function () { $(this).prop('readonly', false).blur().focus(); });
onfocusout="this.setAttribute('readonly', 'readonly');"
Die beste Lösung:
Verhindern Sie den automatischen Vervollständigungsbenutzernamen (oder die E-Mail-Adresse) und das Kennwort:
<input type="email" name="email"><!-- Can be type="text" -->
<input type="password" name="password" autocomplete="new-password">
Verhindern Sie die automatische Vervollständigung eines Felds:
<input type="text" name="field" autocomplete="nope">
Erläuterung:
autocomplete
setzt die Arbeit in fort <input>
, autocomplete="off"
funktioniert nicht, aber Sie können off
zu einer zufälligen Zeichenfolge wechseln , z nope
.
Arbeitet in:
Chrom: 49, 50, 51, 52, 53, 54, 55, 56, 57, 58, 59, 60, 61, 62, 63 und 64
Firefox: 44, 45, 46, 47, 48, 49, 50, 51, 52, 53, 54, 55, 56, 57 und 58
autocomplete
Attribut festzulegen, und es werden weiterhin vorherige Einträge als Vorschläge für die automatische Vervollständigung unter der Eingabe angezeigt.
autocomplete
habe, ich erhalte immer noch eine Dropdown-Liste mit Vorschlägen, die auf zuvor eingegebenen Werten basiert. Es ist in Ordnung auf dem Desktop, aber nicht auf Android Chrome.
Ein bisschen spät zum Spiel ... aber ich bin gerade auf dieses Problem gestoßen und habe mehrere Fehler versucht, aber dieser funktioniert für mich auf MDN
In einigen Fällen schlägt der Browser weiterhin Werte für die automatische Vervollständigung vor, auch wenn das Attribut für die automatische Vervollständigung deaktiviert ist. Dieses unerwartete Verhalten kann für Entwickler ziemlich rätselhaft sein. Der Trick, um die Nichterfüllung wirklich zu erzwingen, besteht darin, dem Attribut eine zufällige Zeichenfolge wie folgt zuzuweisen:
autocomplete="nope"
Hinzufügen autocomplete="off"
wird es nicht schneiden.
Ändern Sie das Attribut für den Eingabetyp in type="search"
.
Google wendet keine automatische Füllung auf Eingaben mit einer Art von Suche an.
Verwenden Sie für die Felder einen nicht standardmäßigen Namen und eine ID, sodass "name_" anstelle von "name" "name_" hat. Browser sehen es dann nicht als Namensfeld. Das Beste daran ist, dass Sie dies für einige, aber nicht alle Felder tun können und einige, aber nicht alle Felder automatisch vervollständigen.
Um das ungültige XHTML zu vermeiden, können Sie dieses Attribut mit Javascript festlegen. Beispiel mit jQuery:
<input type="text" class="noAutoComplete" ... />
$(function() {
$('.noAutoComplete').attr('autocomplete', 'off');
});
Das Problem ist, dass Benutzer ohne Javascript die Autocomplete-Funktionalität erhalten.
Ich kann nicht glauben, dass dies noch so lange nach der Meldung ein Problem ist. Die oben genannten Lösungen haben bei mir nicht funktioniert, da Safari zu wissen schien, wann das Element nicht angezeigt oder außerhalb des Bildschirms angezeigt wurde. Für mich hat jedoch Folgendes funktioniert:
<div style="height:0px; overflow:hidden; ">
Username <input type="text" name="fake_safari_username" >
Password <input type="password" name="fake_safari_password">
</div>
Hoffe das ist nützlich für jemanden!
Also hier ist es:
function turnOnPasswordStyle() {
$('#inputpassword').attr('type', "password");
}
<input oninput="turnOnPasswordStyle()" id="inputpassword" type="text">
Dies ist ein Sicherheitsproblem, das Browser jetzt ignorieren. Browser identifizieren und speichern Inhalte mithilfe von Eingabenamen, auch wenn Entwickler der Ansicht sind, dass die Informationen vertraulich sind und nicht gespeichert werden sollten. Wenn Sie einen Eingabenamen zwischen zwei Anforderungen unterscheiden, wird das Problem behoben (wird jedoch weiterhin im Cache des Browsers gespeichert und der Cache des Browsers wird vergrößert). Bitten Sie den Benutzer, Optionen in den Einstellungen seines Browsers zu aktivieren oder zu deaktivieren. Dies ist keine gute Lösung. Das Problem kann im Backend behoben werden.
Hier ist mein Fix. Ein Ansatz, den ich in meinem Framework implementiert habe. Alle Autocomplete-Elemente werden mit einer versteckten Eingabe wie folgt generiert:
<? $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>
Der Server verarbeitet dann Post-Variablen wie folgt:
foreach ($_POST as $key => $val)
{
if(preg_match('#^__autocomplete_fix_#', $key) === 1){
$n = substr($key, 19);
if(isset($_POST[$n]))$_POST[$val] = $_POST[$n];
}
}
Auf den Wert kann wie gewohnt zugegriffen werden
var_dump($_POST['username']);
Und der Browser kann keine Informationen aus der vorherigen Anfrage oder von früheren Benutzern vorschlagen.
Alles funktioniert wie ein Zauber, auch wenn Browser-Updates die automatische Vervollständigung ignorieren möchten oder nicht. Das war der beste Weg, um das Problem für mich zu beheben.
Keiner der hier genannten Hacks hat in Chrome für mich funktioniert. Das Problem wird hier diskutiert: https://code.google.com/p/chromium/issues/detail?id=468153#c41
Hinzufügen in einem <form>
Werk (zumindest für den Moment):
<div style="display: none;">
<input type="text" id="PreventChromeAutocomplete" name="PreventChromeAutocomplete" autocomplete="address-level4" />
</div>
maxlength="0"
verhindert das Hinzufügen , dass Firefox das Feld automatisch ausfüllt.