Jak wyłączyć autouzupełnianie przeglądarki w polu formularza / tagu wejściowym?

Jak wyłączyć autocompletew głównych przeglądarkach dla określonego input(lub form field)?

Firefox 30 ignoruje autocomplete="off"hasła, zamiast tego pyta użytkownika, czy hasło powinno być przechowywane na kliencie. Zwróć uwagę na następujący komentarz z 5 maja 2014 r .:

• Menedżer haseł zawsze pyta, czy chce zapisać hasło. Hasła nie są zapisywane bez zgody użytkownika.
• Jesteśmy trzecią przeglądarką, która wprowadziła tę zmianę, po IE i Chrome.

Zgodnie z dokumentacją Mozilla Developer Network atrybut Boolean formularza element autocompletezapobiega buforowaniu danych formularza w starszych przeglądarkach.

<input type="text" name="foo" autocomplete="off" />

Oprócz autocomplete=offtego nazwy pól formularzy mogą być losowe według kodu, który generuje stronę, być może poprzez dodanie na końcu nazw ciągów specyficznych dla sesji.

Po przesłaniu formularza możesz go usunąć przed przetworzeniem po stronie serwera. Uniemożliwi to przeglądarce znalezienie kontekstu dla twojego pola, a także może pomóc w zapobieganiu atakom XSRF, ponieważ osoba atakująca nie będzie w stanie odgadnąć nazw pól podczas przesyłania formularza.

Większość głównych przeglądarek i menedżerów haseł (poprawnie IMHO) teraz ignoruje autocomplete=off.

Dlaczego? Wiele banków i innych stron o „wysokim bezpieczeństwie” dodanych autocomplete=offdo swoich stron logowania „ze względów bezpieczeństwa”, ale w rzeczywistości zmniejsza to bezpieczeństwo, ponieważ powoduje, że ludzie zmieniają hasła w tych witrynach o wysokim bezpieczeństwie, aby były łatwe do zapamiętania (a tym samym złamania) od momentu autouzupełniania był zepsuty.

Dawno temu większość menedżerów haseł zaczęła ignorować autocomplete=off, a teraz przeglądarki zaczynają robić to samo tylko w przypadku wprowadzania nazwy użytkownika / hasła.

Niestety błędy w autouzupełnianiu implementują wstawianie nazwy użytkownika i / lub hasła w nieodpowiednich polach formularza, powodując błędy sprawdzania poprawności formularza lub jeszcze gorzej, przypadkowo wstawiając nazwy użytkownika w pola, które celowo pozostawiono puste przez użytkownika.

Co robi programista internetowy?

• Jeśli możesz sam przechowywać wszystkie pola hasła na stronie, to dobry początek, ponieważ wydaje się, że obecność pola hasła jest głównym wyzwalaczem autouzupełniania użytkownika / przepustki w celu uruchomienia. W przeciwnym razie przeczytaj poniższe wskazówki.
• Safari zauważa, że ​​istnieją 2 pola hasła i wyłącza autouzupełnianie w tym przypadku, zakładając, że musi to być formularz zmiany hasła, a nie formularz logowania. Upewnij się więc, że używasz 2 pól hasła (nowe i potwierdź nowe) dla wszystkich formularzy, na które zezwalasz

• Chrome 34 niestety spróbuje automatycznie wypełnić pola użytkownik / hasło, gdy tylko zobaczy pole hasła. Jest to dość zły błąd, który - mam nadzieję - zmieni zachowanie Safari. Jednak dodanie tego na górze formularza wydaje się wyłączać automatyczne uzupełnianie hasła:

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

Nie zbadałem jeszcze dokładnie IE ani Firefoksa, ale chętnie zaktualizuję odpowiedź, jeśli inni mają informacje w komentarzach.

Czasami nawet autouzupełnianie = off będzie nie przeszkadza, aby wypełnić w mandatów w nieodpowiednich obszarach, ale nie użytkownika lub pole nick.

To obejście stanowi uzupełnienie postu apinsteina na temat zachowania przeglądarki.

napraw autouzupełnianie przeglądarki w trybie tylko do odczytu i ustaw zapisywalne fokus (kliknij i tab)

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

Aktualizacja: Mobile Safari ustawia kursor w polu, ale nie wyświetla wirtualnej klawiatury. Nowa poprawka działa jak poprzednio, ale obsługuje wirtualną klawiaturę:

<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();  }" />

Demo na żywo https://jsfiddle.net/danielsuess/n0scguv6/

// UpdateEnd

Ponieważ przeglądarka automatycznie wypełnia poświadczenia w złym polu tekstowym !?

Zauważyłem to dziwne zachowanie w Chrome i Safari, gdy pola hasła są w tej samej formie. Myślę, że przeglądarka szuka pola hasła, aby wstawić zapisane poświadczenia. Następnie automatycznie wypełnia (zgadując z obserwacji) najbliższe tekstowe pole wejściowe, które pojawia się przed polem hasła w DOM. Ponieważ przeglądarka jest ostatnią instancją i nie można jej kontrolować,

Ta poprawka tylko do odczytu działała dla mnie.

<form name="form1" id="form1" method="post" 
      autocomplete="off" action="http://www.example.com/form.cgi">

Będzie to działać w Internet Explorer i Mozilla FireFox, wadą jest to, że nie jest to standard XHTML.

Rozwiązaniem dla Chrome jest dodanie autocomplete="new-password"hasła typu wejściowego. Sprawdź poniższy przykład.

Przykład:

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

Chrome zawsze automatycznie uzupełnia dane, jeśli znajdzie pole typu hasło , wystarczające do wskazania tego pola autocomplete = "new-password".

To działa dobrze dla mnie.

Uwaga: upewnij się, F12że wprowadzone zmiany obowiązują, wiele razy przeglądarki zapisują stronę w pamięci podręcznej, co sprawiło, że nie działałem, ale przeglądarka tak naprawdę nie wprowadziła zmian.

Jak powiedzieli inni, odpowiedź brzmi autocomplete="off"

Myślę jednak, że warto wyjaśnić, dlaczego warto to stosować w niektórych przypadkach, ponieważ niektóre odpowiedzi na to pytanie i duplikaty pytań sugerują, że lepiej nie wyłączać tego.

Zatrzymywanie przeglądarek przechowujących numery kart kredytowych nie powinno być pozostawione użytkownikom. Zbyt wielu użytkowników nawet nie zdaje sobie sprawy, że to problem.

Szczególnie ważne jest wyłączenie go w polach kodów bezpieczeństwa kart kredytowych. Jak podaje ta strona :

„Nigdy nie przechowuj kodu bezpieczeństwa ... jego wartość zależy od domniemania, że ​​jedynym sposobem na jego dostarczenie jest odczytanie go z fizycznej karty kredytowej, co dowodzi, że osoba, która go dostarczyła, faktycznie trzyma kartę”.

Problem polega na tym, że jeśli jest to komputer publiczny (kafejka internetowa, biblioteka itp.), Inni użytkownicy mogą łatwo ukraść dane karty, a nawet na własnej maszynie złośliwa witryna może ukraść dane z autouzupełnianiem .

Rozwiązałem niekończącą się walkę z Google Chrome przy użyciu losowych postaci. Kiedy zawsze renderujesz autouzupełnianie za pomocą losowego ciągu, nigdy niczego nie zapamięta.

<input name="name" type="text" autocomplete="rutjfkde">

Mam nadzieję, że pomoże to innym ludziom.

Musiałbym zacząć różnić się od tych odpowiedzi, które mówią, aby uniknąć wyłączenia autouzupełniania.

Pierwszą rzeczą, o której należy wspomnieć, jest to, że autouzupełnianie, które nie jest jawnie wyłączone w polach formularza logowania, kończy się niepowodzeniem PCI-DSS. Ponadto, jeśli komputer lokalny użytkownika zostanie przejęty, atakujący może w prosty sposób uzyskać dowolne dane autouzupełniania, ponieważ są one przechowywane w sposób niezauważalny.

Z pewnością istnieje argument za użytecznością, jednak istnieje bardzo dobra równowaga, jeśli chodzi o to, które pola formularza powinny mieć wyłączone autouzupełnianie, a które nie.

Trzy opcje: po pierwsze:

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

Druga:

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

Po trzecie (kod javascript):

$('input').attr('autocomplete', 'off');

Na pokrewnej, a właściwie zupełnie przeciwnej nucie -

„Jeśli jesteś użytkownikiem wyżej wymienionego formularza i chcesz ponownie włączyć funkcję autouzupełniania, użyj bookmarkletu„ zapamiętaj hasło ”z tej strony bookmarkletów . Usuwa wszystkie autocomplete="off"atrybuty ze wszystkich formularzy na stronie. Walcz dobrze! „

W rzeczywistości wykorzystaliśmy pomysł sasb dla jednej strony. Była to aplikacja internetowa do oprogramowania medycznego do prowadzenia gabinetu lekarskiego. Jednak wielu naszych klientów było chirurgami, którzy korzystali z wielu różnych stacji roboczych, w tym z półpublicznych terminali. Chcieli więc upewnić się, że lekarz, który nie rozumie konsekwencji automatycznie zapisanych haseł lub nie zwraca uwagi, nie może przypadkowo pozostawić łatwo dostępnych danych logowania. Oczywiście stało się to wcześniej niż pomysł prywatnego przeglądania, który zaczyna się pojawiać w IE8, FF3.1 itd. Mimo to wielu lekarzy jest zmuszonych używać oldschoolowych przeglądarek w szpitalach z IT, które się nie zmieni.

Mieliśmy więc stronę logowania, która generowała losowe nazwy pól, które działałyby tylko dla tego postu. Tak, jest to mniej wygodne, ale po prostu uderza użytkownika ponad głowę, że nie przechowuje danych logowania na terminalach publicznych.

Żadne z rozwiązań nie działało dla mnie w tej rozmowie.

W końcu wymyśliłem czyste rozwiązanie HTML, które nie wymaga Javascript , działa w nowoczesnych przeglądarkach (oprócz IE; musiałem mieć co najmniej 1 haczyk, prawda?) I nie wymaga wyłączania autouzupełniania dla całego formularza.

Po prostu wyłącz autouzupełnianie na, forma następnie WŁĄCZ je, inputjeśli chcesz, aby działało w formularzu. Na przykład:

<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>

Właśnie ustawiłem autocomplete="off". Jest to bardzo dobry powód: chcesz zapewnić własną funkcjonalność autouzupełniania!

Próbowałem nieskończonych rozwiązań, a potem znalazłem to:

Zamiast autocomplete="off"po prostu użyćautocomplete="false"

To takie proste i działa jak urok w Google Chrome!

To działa dla mnie.

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

Możemy również użyć tej strategii w innych kontrolkach, takich jak tekst, zaznaczanie itp

Myślę, że autocomplete=offjest obsługiwany w HTML 5.

Zastanów się, dlaczego chcesz to zrobić - w niektórych sytuacjach może to mieć sens, ale nie rób tego tylko ze względu na to.

Jest to mniej wygodne dla użytkowników, a nawet problem bezpieczeństwa w OS X (wspomniany przez Sorena poniżej). Jeśli martwisz się o zdalne kradzież haseł - rejestrator naciśnięć klawiszy nadal może to zrobić, nawet jeśli aplikacja tego używa autcomplete=off.

Jako użytkownik, który zdecyduje się, aby przeglądarka zapamiętała (większość) moich informacji, uważałbym to za irytujące, gdyby Twoja strona nie pamiętała moich.

Oprócz

autocomplete="off"

Posługiwać się

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

dla wejść, które nie chcą, żeby zapamiętać dane formularza ( username, passwordetc.), jak pokazano poniżej:

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

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

Mam nadzieję że to pomoże.

Najlepszym rozwiązaniem:

Zapobiegaj autouzupełnianiu nazwy użytkownika (lub adresu e-mail) i hasła:

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

Zapobiegaj autouzupełnianiu pola:

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

Objaśnienie: autocompletekontynuuje pracę <input>, autocomplete="off"nie działa, ale można zmienić offciąg znaków na losowy, np nope.

Pracuje w:

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

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

Trochę za późno na grę ... ale właśnie natknąłem się na ten problem i próbowałem kilku awarii, ale ten działa dla mnie znaleziony w MDN

W niektórych przypadkach przeglądarka będzie sugerować wartości autouzupełniania, nawet jeśli atrybut autouzupełniania jest wyłączony. To nieoczekiwane zachowanie może być dość zagadkowe dla programistów. Sztuczka, aby naprawdę wymusić brak ukończenia, polega na przypisaniu losowego ciągu do atrybutu w następujący sposób:

autocomplete="nope"

Dodawanie

autocomplete="off"

na znacznik formularza wyłączy autouzupełnianie przeglądarki (co zostało wcześniej wpisane w tym polu) ze wszystkich inputpól w tym konkretnym formularzu.

Testowane na:

• Firefox 3.5, 4 BETA
• Internet Explorer 8
• Chrom

Dodanie tego autocomplete="off"nie spowoduje cięcia.

Zmień atrybut typu danych wejściowych na type="search".
Google nie stosuje automatycznego wypełniania do danych wejściowych z rodzajem wyszukiwania.

Użyj niestandardowej nazwy i identyfikatora dla pól, aby zamiast „nazwa” mieć „nazwa_”. Przeglądarki nie będą wtedy widzieć go jako pola nazwy. Najlepsze jest to, że możesz to zrobić na niektórych, ale nie na wszystkich polach i automatycznie uzupełni niektóre, ale nie wszystkie pola.

Aby uniknąć nieprawidłowego XHTML, możesz ustawić ten atrybut za pomocą javascript. Przykład użycia jQuery:

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

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

Problem polega na tym, że użytkownicy bez javascript otrzymają funkcję autouzupełniania.

wypróbuj je również, jeśli po prostu autocomplete="off"nie działa:

autocorrect="off" autocapitalize="off" autocomplete="off"

Nie mogę uwierzyć, że jest to problem tak długo po zgłoszeniu. Powyższe rozwiązania nie działały dla mnie, ponieważ safari zdawało się wiedzieć, kiedy element nie był wyświetlany lub poza ekranem, jednak następujące działania działały dla mnie:

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

Mam nadzieję, że jest to przydatne dla kogoś!

Oto on:

function turnOnPasswordStyle() {
  $('#inputpassword').attr('type', "password");
}

<input oninput="turnOnPasswordStyle()" id="inputpassword" type="text">

Jest to problem bezpieczeństwa, który przeglądarki ignorują teraz. Przeglądarki identyfikują i przechowują treść za pomocą nazw wejściowych, nawet jeśli programiści uważają, że informacje są wrażliwe i nie należy ich przechowywać. Zróżnicowanie nazwy wejściowej między 2 żądaniami rozwiąże problem (ale nadal zostanie zapisane w pamięci podręcznej przeglądarki i zwiększy pamięć podręczną przeglądarki). Poproś użytkownika o włączenie lub wyłączenie opcji w ustawieniach przeglądarki nie jest dobrym rozwiązaniem. Problem można rozwiązać w backend.

Oto moja poprawka. Podejście, które wdrożyłem w swoich ramach. Wszystkie elementy autouzupełniania są generowane z ukrytym wejściem, takim jak ten:

<? $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>

Serwer następnie przetwarza zmienne przesyłane w następujący sposób:

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

Dostęp do wartości można uzyskać jak zwykle

var_dump($_POST['username']);

Przeglądarka nie będzie w stanie sugerować informacji z poprzedniego żądania ani od poprzednich użytkowników.

Wszystko działa jak urok, nawet jeśli aktualizacje przeglądarek chcą zignorować autouzupełnianie lub nie. To był najlepszy sposób na rozwiązanie tego problemu.

Żaden z wymienionych tu hacków nie działał dla mnie w Chrome. Dyskusja na ten temat tutaj: https://code.google.com/p/chromium/issues/detail?id=468153#c41

Dodanie tego do <form>dzieła (przynajmniej na razie):

<div style="display: none;">
    <input type="text" id="PreventChromeAutocomplete" name="PreventChromeAutocomplete" autocomplete="address-level4" />
</div>

Możesz użyć w danych wejściowych.

Na przykład;

<input type=text name="test" autocomplete="off" />