Come si disabilita il completamento automatico del browser sul campo del modulo Web / tag di input?

Come si disabilita autocompletenei principali browser per uno specifico input(o form field)?

Firefox 30 ignora le autocomplete="off"password, scegliendo invece di chiedere all'utente se la password deve essere archiviata sul client. Nota il seguente commento del 5 maggio 2014:

• Il gestore password richiede sempre se desidera salvare una password. Le password non vengono salvate senza il permesso dell'utente.
• Siamo il terzo browser che implementa questa modifica, dopo IE e Chrome.

Secondo la documentazione di Mozilla Developer Network , l'attributo dell'elemento del modulo booleano autocompleteimpedisce la memorizzazione nella cache dei dati del modulo nei browser meno recenti.

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

Inoltre autocomplete=off, potresti anche rendere casuali i nomi dei campi del modulo in base al codice che genera la pagina, magari aggiungendo una stringa specifica della sessione alla fine dei nomi.

Quando il modulo viene inviato, è possibile rimuovere quella parte prima di elaborarli sul lato server. Ciò impedirebbe al browser Web di trovare un contesto per il proprio campo e potrebbe anche aiutare a prevenire gli attacchi XSRF perché un utente malintenzionato non sarebbe in grado di indovinare i nomi dei campi per l'invio di un modulo.

La maggior parte dei principali browser e gestori di password (correttamente, IMHO) ora ignorano autocomplete=off.

Perché? Molte banche e altri siti Web di "alta sicurezza" sono stati aggiunti autocomplete=offalle loro pagine di accesso "per motivi di sicurezza", ma ciò in realtà riduce la sicurezza poiché consente alle persone di modificare le password su questi siti ad alta sicurezza per essere facili da ricordare (e quindi rompere) dal completamento automatico era rotto.

Molto tempo fa la maggior parte dei gestori di password ha iniziato a ignorare autocomplete=offe ora i browser stanno iniziando a fare lo stesso solo per gli input di nome utente / password.

Sfortunatamente, i bug nelle implementazioni del completamento automatico inseriscono informazioni su nome utente e / o password nei campi del modulo inappropriati, causando errori di convalida del modulo, o peggio ancora, inserendo accidentalmente nomi utente in campi che sono stati lasciati intenzionalmente vuoti dall'utente.

Cosa deve fare uno sviluppatore web?

• Se riesci a mantenere tutti i campi password su una pagina da soli, è un ottimo inizio in quanto sembra che la presenza di un campo password sia il principale fattore scatenante per l'avvio dell'utente / completamento automatico. Altrimenti, leggi i suggerimenti di seguito.
• Safari nota che ci sono 2 campi password e disabilita il completamento automatico in questo caso, supponendo che debba essere un modulo di modifica della password, non un modulo di accesso. Quindi assicurati di usare 2 campi password (nuovi e confermare nuovi) per tutti i moduli in cui lo consenti

• Chrome 34, sfortunatamente, proverà a compilare automaticamente i campi con user / pass ogni volta che vedrà un campo password. Questo è piuttosto un brutto bug che, si spera, cambieranno il comportamento di Safari. Tuttavia, l'aggiunta di questo nella parte superiore del modulo sembra disabilitare la compilazione automatica della password:

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

Non ho ancora studiato a fondo IE o Firefox, ma sarò felice di aggiornare la risposta se altri hanno informazioni nei commenti.

A volte = anche autocomplete off sarebbe non impedisce di riempire le credenziali in campi sbagliati, ma non campo soprannome utente o.

Questa soluzione alternativa si aggiunge al post di Apinstein sul comportamento del browser.

correggi il riempimento automatico del browser in sola lettura e imposta il focus scrivibile (clic e scheda)

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

Aggiornamento: Mobile Safari imposta il cursore nel campo, ma non mostra la tastiera virtuale. La nuova correzione funziona come prima ma gestisce la tastiera virtuale:

<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 live https://jsfiddle.net/danielsuess/n0scguv6/

// UpdateEnd

Perché il browser riempie automaticamente le credenziali nel campo di testo sbagliato !?

Ho notato questo strano comportamento su Chrome e Safari, quando ci sono campi password nella stessa forma. Suppongo che il browser cerchi un campo password per inserire le credenziali salvate. Quindi riempie automaticamente (solo indovinando a causa dell'osservazione) il campo di input simile al testo più vicino, che appare prima del campo della password in DOM. Poiché il browser è l'ultima istanza e non puoi controllarlo,

Questa soluzione di sola lettura sopra ha funzionato per me.

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

Funzionerà in Internet Explorer e Mozilla FireFox, il rovescio della medaglia è che non è lo standard XHTML.

La soluzione per Chrome è aggiungere autocomplete="new-password"alla password del tipo di input. Si prega di controllare l'esempio seguente.

Esempio:

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

Chrome completa sempre automaticamente i dati se trova una casella di tipo password , quanto basta per indicare quella casella autocomplete = "new-password".

Questo funziona bene per me.

Nota: assicurati F12che le modifiche abbiano effetto, molte volte i browser salvano la pagina nella cache, questo mi ha fatto una cattiva impressione che non funzionasse, ma il browser non ha effettivamente apportato le modifiche.

Come altri hanno già detto, la risposta è autocomplete="off"

Tuttavia, penso che valga la pena affermare perché è una buona idea usarlo in alcuni casi poiché alcune risposte a questo e domande duplicate hanno suggerito che è meglio non spegnerlo.

L'arresto dei browser che memorizzano i numeri delle carte di credito non deve essere lasciato agli utenti. Troppi utenti non si accorgeranno nemmeno che è un problema.

È particolarmente importante disattivarlo nei campi per i codici di sicurezza della carta di credito. Come afferma questa pagina :

"Non memorizzare mai il codice di sicurezza ... il suo valore dipende dalla presunzione che l'unico modo per fornirlo sia leggerlo dalla carta di credito fisica, dimostrando che la persona che lo fornisce detiene effettivamente la carta."

Il problema è che, se si tratta di un computer pubblico (cyber café, biblioteca ecc.), È facile per gli altri utenti rubare i dettagli della tua carta e anche sul tuo computer un sito Web dannoso potrebbe rubare i dati di completamento automatico .

Ho risolto la lotta senza fine con Google Chrome con l'uso di personaggi casuali. Quando esegui sempre il rendering con completamento casuale con stringa casuale, non ricorderà mai nulla.

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

Spero che possa aiutare altre persone.

Dovrei supplicare di dissentire da quelle risposte che dicono per evitare di disabilitare il completamento automatico.

La prima cosa da evidenziare è che il completamento automatico non disabilitato esplicitamente nei campi del modulo di accesso è un errore PCI-DSS. Inoltre, se la macchina locale di un utente è compromessa, tutti i dati di completamento automatico possono essere banalmente ottenuti da un utente malintenzionato a causa della sua memorizzazione in chiaro.

C'è sicuramente un argomento per l'usabilità, tuttavia c'è un ottimo equilibrio quando si tratta di quali campi del modulo dovrebbero essere disabilitati per il completamento automatico e quali no.

Tre opzioni: prima:

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

Secondo:

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

Terzo (codice javascript):

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

Su una nota correlata o in realtà, sulla nota completamente opposta -

"Se sei l'utente del modulo sopra menzionato e desideri riattivare la funzionalità di completamento automatico, usa il bookmarklet" Ricorda password "da questa pagina dei bookmarklet . Rimuove tutti gli autocomplete="off"attributi da tutti i moduli della pagina. Continua a combattere! "

In realtà abbiamo usato l'idea di sasb per un sito. Era un'app web di software medico per gestire l'ufficio di un medico. Tuttavia, molti dei nostri clienti erano chirurghi che utilizzavano molte stazioni di lavoro diverse, compresi i terminali semi-pubblici. Quindi, volevano assicurarsi che un medico che non capisse le implicazioni delle password salvate automaticamente o che non prestasse attenzione non possa accidentalmente lasciare le loro informazioni di accesso facilmente accessibili. Naturalmente, questo era prima dell'idea della navigazione privata che stava iniziando a essere presente in IE8, FF3.1, ecc. Anche così, molti medici sono costretti a utilizzare i browser della vecchia scuola negli ospedali con IT che non cambierà.

Quindi, abbiamo avuto la pagina di accesso generare nomi di campi casuali che avrebbero funzionato solo per quel post. Sì, è meno conveniente, ma sta solo colpendo l'utente per non memorizzare le informazioni di accesso sui terminali pubblici.

Nessuna delle soluzioni ha funzionato per me in questa conversazione.

Alla fine ho capito una soluzione HTML pura che non richiede Javascript , funziona nei browser moderni (tranne IE; ci doveva essere almeno 1 cattura, giusto?), E non richiede di disabilitare il completamento automatico per l'intero modulo.

Basta disattivare il completamento automatico sul forme quindi accenderlo per qualsiasi inputsi desideri che funzioni all'interno del modulo. Per esempio:

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

Basta impostare autocomplete="off". C'è un ottimo motivo per farlo: vuoi fornire la tua funzionalità di completamento automatico!

Ho provato infinite soluzioni, e poi ho trovato questo:

Invece di autocomplete="off"usare semplicementeautocomplete="false"

Semplice come quello, e funziona come un fascino anche in Google Chrome!

Questo funziona per me.

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

Possiamo anche usare questa strategia in altri controlli come testo, selezionare ecc

Penso che autocomplete=offsia supportato in HTML 5.

Chiediti perché vuoi farlo, tuttavia, potrebbe avere senso in alcune situazioni, ma non farlo solo per il gusto di farlo.

È meno conveniente per gli utenti e nemmeno un problema di sicurezza in OS X (menzionato da Soren di seguito). Se sei preoccupato per le persone che hanno rubato le loro password in remoto, un registratore di tasti potrebbe comunque farlo anche se l'app viene utilizzata autcomplete=off.

Come utente che sceglie di avere un browser che ricorda (la maggior parte) delle mie informazioni, troverei fastidioso se il tuo sito non ricordasse il mio.

Inoltre

autocomplete="off"

Uso

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

per gli ingressi che non si desidera loro di ricordare i dati dei moduli ( username, password, ecc) come mostrato di seguito:

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

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

Spero che sia di aiuto.

La migliore soluzione:

Impedisci il nome utente (o e-mail) e la password del completamento automatico:

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

Impedisci il completamento automatico di un campo:

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

Spiegazione: autocompletecontinua a lavorare <input>, autocomplete="off"non funziona, ma è possibile passare offa una stringa casuale, come nope.

Funziona in:

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

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

Un po 'tardi al gioco ... ma ho riscontrato questo problema e ho provato diversi fallimenti, ma questo funziona per me trovato su MDN

In alcuni casi, il browser continuerà a suggerire i valori di completamento automatico anche se l'attributo di completamento automatico è disattivato. Questo comportamento inaspettato può essere abbastanza sconcertante per gli sviluppatori. Il trucco per forzare davvero il non completamento è quello di assegnare una stringa casuale all'attributo in questo modo:

autocomplete="nope"

Aggiungere il

autocomplete="off"

al tag del modulo disabiliterà il completamento automatico del browser (ciò che è stato precedentemente digitato in quel campo) da tutti i inputcampi all'interno di quel particolare modulo.

Testato su:

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

L'aggiunta autocomplete="off"non lo taglierà.

Cambia l'attributo del tipo di input in type="search".
Google non applica il riempimento automatico agli input con un tipo di ricerca.

Usa un nome e un ID non standard per i campi, quindi anziché "nome" hanno "nome_". I browser non lo vedranno quindi come il campo del nome. La parte migliore è che puoi farlo in alcuni ma non in tutti i campi e completerà automaticamente alcuni ma non tutti i campi.

Al fine di evitare l'XHTML non valido, è possibile impostare questo attributo utilizzando JavaScript. Esempio usando jQuery:

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

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

Il problema è che gli utenti senza javascript otterranno la funzionalità di completamento automatico.

prova anche questi se autocomplete="off"non funziona:

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

Non riesco a credere che questo sia ancora un problema così a lungo dopo che è stato segnalato. Le soluzioni di cui sopra non hanno funzionato per me, poiché Safari sembrava sapere quando l'elemento non era visualizzato o off-screen, tuttavia quanto segue ha funzionato per me:

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

Spero che sia utile per qualcuno!

Quindi eccolo qui:

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

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

Questo è un problema di sicurezza che i browser ora ignorano. I browser identificano e memorizzano i contenuti utilizzando i nomi di input, anche se gli sviluppatori considerano le informazioni sensibili e non devono essere archiviate. Fare un nome di input diverso tra 2 richieste risolverà il problema (ma verrà comunque salvato nella cache del browser e aumenterà anche la cache del browser). Chiedere all'utente di attivare o disattivare le opzioni nelle impostazioni del proprio browser non è una buona soluzione. Il problema può essere risolto nel backend.

Ecco la mia soluzione. Un approccio che ho implementato nel mio quadro. Tutti gli elementi di completamento automatico vengono generati con un input nascosto come questo:

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

Il server quindi elabora le variabili post in questo modo:

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

È possibile accedere al valore come al solito

var_dump($_POST['username']);

E il browser non sarà in grado di suggerire informazioni dalla richiesta precedente o da utenti precedenti.

Tutto funziona come un incantesimo, anche se gli aggiornamenti dei browser, vogliono ignorare il completamento automatico o meno. Questo è stato il modo migliore per risolvere il problema per me.

Nessuno degli hack menzionati qui ha funzionato per me in Chrome. C'è una discussione del problema qui: https://code.google.com/p/chromium/issues/detail?id=468153#c41

Aggiungendo questo all'interno di un'opera <form>(almeno per ora):

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

È possibile utilizzare in input.

Per esempio;

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