¿Cómo deshabilita el autocompletado del navegador en el campo de formulario web / etiqueta de entrada?


2793

¿Cómo se deshabilita autocompleteen los principales navegadores para un input(o form field) específico ?


2
En algunos sistemas donde los probadores tienen que ingresar manualmente una gran cantidad de información una y otra vez, puede ser útil tener la opción como configurable para que al probarla pueda deshabilitarla y simplemente presione 'tab> flecha hacia abajo> tab> flecha hacia abajo, etc. . '
Simon_Weaver

Respuestas:


2626

Firefox 30 ignora las autocomplete="off"contraseñas, optando por preguntar al usuario si la contraseña debe almacenarse en el cliente. Tenga en cuenta el siguiente comentario del 5 de mayo de 2014:

  • El administrador de contraseñas siempre pregunta si desea guardar una contraseña. Las contraseñas no se guardan sin el permiso del usuario.
  • Somos el tercer navegador en implementar este cambio, después de IE y Chrome.

De acuerdo con la documentación de Mozilla Developer Network , el atributo de elemento de formulario booleano autocompleteevita que los datos del formulario se almacenen en caché en navegadores antiguos.

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

45
Esto no funcionó para mí en Firefox 3.0.3. Tuve que poner el atributo de autocompletar en el FORMULARIO en lugar de la ENTRADA.
Winston Fassett

17
Autocompletar sólo se define en los estándares HTML 5, por lo que se romperá ningún validaciones que se ejecutan en contra de HTML 4 * ....
Jrgns

96
@ Winston, debe ponerlo tanto en el formulario, como en el elemento de entrada en sí. De esa manera, usted cubre todas las no estándares de los navegadores.
AviD

83
Y recuerde deshabilitar su extensión autocomplete = on (si está usando Chrome) antes de probar su aplicación web. De lo contrario, te sentirás realmente tonto como yo. ;)
Jo Liss


314

Además autocomplete=off, también puede hacer que los nombres de los campos de su formulario sean aleatorizados por el código que genera la página, quizás agregando una cadena específica de la sesión al final de los nombres.

Cuando se envía el formulario, puede quitar esa parte antes de procesarlos en el lado del servidor. Esto evitaría que el navegador web encuentre contexto para su campo y también podría ayudar a prevenir ataques XSRF porque un atacante no podría adivinar los nombres de campo para el envío de un formulario.


10
Esta es una solución mucho mejor en comparación con el uso de autocompletar = "off". Todo lo que tiene que hacer es generar un nuevo nombre en cada carga de la página y guardar ese nombre en una $ _SESSION para uso futuro:$_SESSION['codefield_name'] = md5(uniqid('auth', true));
enchance el

78
No, esta no es una mejor solución, porque el origen de preferencia para esta configuración es el agente de usuario también conocido como navegador web. Hay una diferencia entre admitir cierto comportamiento (que HTML 5 intenta hacer) y forzarlo al decidir en nombre del usuario, lo que sugiere que es una "solución mucho mejor".
amn

15
Esta solución puede funcionar con todos los navegadores, por lo que a ese respecto es "mejor". Aún así, amn es correcto, decidir deshabilitar el autocompletado en nombre de sus usuarios no es una buena idea. Esto significa que solo deshabilitaría el autocompletado en situaciones muy específicas, como cuando planea construir su propia funcionalidad de autocompletar y no desea conflictos o comportamientos extraños.
macguru2000

8
Con respecto a los ataques XSRF, no estoy seguro de qué tipo de ataque estaba imaginando, pero ¿no podría el atacante quitarse la parte final de la misma manera que lo hace en el lado del servidor para identificar los campos? O si el atacante está publicando los campos, ¿no podrían agregar su propia cadena aleatoria ya que el servidor la quitará?
xr280xr

99
@ macguru2000 construir su propio autocompletado es un caso de uso completamente legítimo y común. Realmente el navegador debería hacer más fácil para los desarrolladores para apagar autocompletar cuando necesitan en lugar de lo que nos obliga a utilizar trucos como éste
whoadave

235

La mayoría de los principales navegadores y administradores de contraseñas (correctamente, en mi humilde opinión) ahora ignoran autocomplete=off.

¿Por qué? Muchos bancos y otros sitios web de "alta seguridad" agregaron autocomplete=offa sus páginas de inicio de sesión "con fines de seguridad", pero esto en realidad disminuye la seguridad, ya que hace que las personas cambien las contraseñas en estos sitios de alta seguridad para que sean fáciles de recordar (y, por lo tanto, descifrar) ya que se completan automáticamente estaba rota.

Hace mucho tiempo, la mayoría de los administradores de contraseñas comenzaron a ignorar autocomplete=off, y ahora los navegadores comienzan a hacer lo mismo solo para las entradas de nombre de usuario / contraseña.

Desafortunadamente, los errores en las implementaciones de autocompletar insertan información de nombre de usuario y / o contraseña en campos de formulario inapropiados, causando errores de validación de formulario, o peor aún, insertando accidentalmente nombres de usuario en campos que el usuario dejó en blanco intencionalmente.

¿Qué debe hacer un desarrollador web?

  • Si puede mantener todos los campos de contraseña en una página por sí mismos, es un gran comienzo, ya que parece que la presencia de un campo de contraseña es el desencadenante principal para que el usuario / pase complete automáticamente. De lo contrario, lea los consejos a continuación.
  • Safari se da cuenta de que hay 2 campos de contraseña y desactiva el autocompletado en este caso, suponiendo que debe ser un formulario de cambio de contraseña, no un formulario de inicio de sesión. Tan solo asegúrese de usar 2 campos de contraseña (nuevo y confirmar nuevo) para cualquier formulario donde permita
  • Desafortunadamente, Chrome 34 intentará completar automáticamente los campos con usuario / contraseña cada vez que vea un campo de contraseña. Este es un error bastante malo que, con suerte, cambiarán el comportamiento de Safari. Sin embargo, agregar esto en la parte superior de su formulario parece deshabilitar la contraseña de autocompletar:

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

Todavía no he investigado a fondo IE o Firefox, pero estaré encantado de actualizar la respuesta si otros tienen información en los comentarios.


55
¿Qué quieres decir con "agregar esto en tu página parece deshabilitar el autocompletado para la página:"
wutzebaer

55
@wutzebaer, Chrome nota el campo de contraseña oculta y detiene el autocompletado. Según se informa, esto es para evitar que el sitio robe información de contraseña sin que el usuario lo note.
David W

66
Su fragmento de código evita que se completen automáticamente los campos de inicio de sesión en Chrome, Firefox, IE 8 e IE 10. No probó IE 11. ¡Qué bueno! Solo respuesta simple que todavía funciona.
Sam Watkins,

3
Su nota de safari también parece funcionar en Chrome, al menos a partir de diciembre de 2015. Tenía un campo de nombre de usuario y contraseña en un formulario de registro que se completaba automáticamente con los datos del formulario de inicio de sesión. La creación de dos type='password'campos en una página hizo que se ignorara automáticamente la función de "guardar contraseña" del navegador, lo que tenía mucho sentido ya que los formularios de registro tienden a pedir la contraseña dos veces cuando los formularios de inicio de sesión solo la solicitan una vez.
Matt Fletcher

3
Parece que ya no funciona en Chrome 55, a menos que el campo de contraseña adicional no esté oculto, lo que anula el propósito.
jokkedk

160

A veces incluso autocomplete = off que no impide llenar de credenciales en los campos erróneos, pero no campo de usuario o apodo.

Esta solución alternativa se suma a la publicación de apinstein sobre el comportamiento del navegador.

arregle el autocompletado del navegador en solo lectura y configure el foco de escritura en foco (clic y pestaña)

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

Actualización: Mobile Safari establece el cursor en el campo, pero no muestra el teclado virtual. New Fix funciona como antes pero maneja el teclado virtual:

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

// UpdateEnd

¿Porque el navegador llena automáticamente las credenciales en el campo de texto incorrecto?

Noto este comportamiento extraño en Chrome y Safari, cuando hay campos de contraseña en la misma forma. Supongo que el navegador busca un campo de contraseña para insertar sus credenciales guardadas. Luego, llena automáticamente (solo adivinando debido a la observación) el campo de entrada de texto más cercano, que aparece antes del campo de contraseña en DOM. Como el navegador es la última instancia y no puede controlarlo,

Esta corrección de solo lectura anterior funcionó para mí.


8
Si no hay javascript, entonces falla todo el formulario. -1
Jimmy Kane

8
@JimmyKane la clave sería agregar también el atributo usando javascript en primer lugar (lo que dsuess no ha hecho aquí, pero solo para completarlo).
Trnelson

@tmelson Lo entiendo, pero ¿por qué usar js para deshabilitarlo? Evitemos js por cosas que se pueden mejorar de forma nativa. De nuevo, estoy de acuerdo contigo.
Jimmy Kane

3
Esto no funciona correctamente en IE8, el campo de contraseña de solo lectura no se puede editar la primera vez que lo enfoca, solo después de desenfocar y enfocar nuevamente. Buena idea, pero desafortunadamente es un poco hacky y no es seguro de usar.
Sam Watkins,

Esto no funciona correctamente en todos los navegadores (por ejemplo, IE 11 y IE Edge). Tan pronto como readonlyse elimine, la selección posterior del campo dará como resultado el retorno del autocompletado.
Se fue la codificación el

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

Esto funcionará en Internet Explorer y Mozilla FireFox, la desventaja es que no es el estándar XHTML.


Me di cuenta de que agregarlo al elemento de formulario no siempre evita que se aplique a entradas individuales dentro del formulario. Por lo tanto, probablemente sea mejor colocarlo directamente en el elemento de entrada.
sholsinger

15
En realidad @sholsinger, es mejor ponerlo tanto en el formulario, como en el elemento de entrada en sí. De esa manera, cubre todas las no estándares de los navegadores.
AviD

2
Lamentablemente, a partir de IE 11, Microsoft ya no respeta esto input type="password". Esperemos que ningún otro navegador elija eliminar esta funcionalidad.
SamHuckaby

Configuración autocomplete="off"en el formes el único que trabajó para Chrome.
Andrew

106

La solución para Chrome es agregar autocomplete="new-password"a la contraseña del tipo de entrada. Por favor, consulte el siguiente ejemplo.

Ejemplo:

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

Chrome siempre completa automáticamente los datos si encuentra un cuadro de tipo contraseña , lo suficiente para indicarlo autocomplete = "new-password".

Esto funciona bien para mi.

Nota: asegúrese de F12que sus cambios surtan efecto, muchas veces los navegadores guardan la página en caché, esto me dio una mala impresión de que no funcionó, pero el navegador en realidad no trajo los cambios.


2
Esto también funciona en Chrome para otros tipos de campos, no solo type = "password".
Jake

Lo usé con contraseña, correo electrónico y tipos de texto y funcionó. Lo usé simplemente así: autocomplete = "new"
Crak_mboutin

autocomplete = "nope" name = "pswd" y usó <input name = "dummyPassword" type = "password" style = "display: none;"> antes del campo de entrada de contraseña real. Esto funcionó para mí.
Denuka el


Esto funciona en casi todos los navegadores ahora, no solo en Chrome: autocompletar # Browser_compatibility .
Andrew Morton

60

Como otros han dicho, la respuesta es autocomplete="off"

Sin embargo, creo que vale la pena decir por qué es una buena idea usar esto en ciertos casos como algunas respuestas a esto y duplicar preguntas han sugerido que es mejor no desactivarlo.

No se debe dejar a los usuarios detener los navegadores que almacenan números de tarjetas de crédito. Demasiados usuarios ni siquiera se darán cuenta de que es un problema.

Es particularmente importante desactivarlo en los campos para códigos de seguridad de tarjetas de crédito. Como esta página dice:

"Nunca almacene el código de seguridad ... su valor depende de la presunción de que la única forma de suministrarlo es leerlo de la tarjeta de crédito física, lo que demuestra que la persona que lo suministra realmente posee la tarjeta".

El problema es que si se trata de una computadora pública (cibercafé, biblioteca, etc.) es fácil para otros usuarios robar los datos de su tarjeta, e incluso en su propia máquina, un sitio web malicioso podría robar datos de autocompletado .


77
si fuera a un sitio y recordara mi tarjeta en el menú desplegable, sería muy infeliz. Me pregunto cómo podrían ser tan descuidados.
Simon_Weaver

99
Caso mucho más simple / más crítico. Cuando visito la página de un usuario en la parte de administración de mi sitio, intenta establecer su nombre de usuario y contraseña para que sean mi nombre de usuario y contraseña de administrador, sin poder decir que este no es un formulario de inicio de sesión. Quiero que me recuerden mi contraseña de administrador, pero es un error crítico que intente aplicar ese nombre de usuario / contraseña recordado a cualquier usuario que luego edite.
rjmunro

34

He resuelto la lucha interminable con Google Chrome con el uso de caracteres aleatorios. Cuando siempre renderiza autocompletar con una cadena aleatoria, nunca recordará nada.

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

Espero que ayude a otras personas.


2
Esto funciona aún mejor. Puede agregar un JS pequeño que genera un código aleatorio para cada carga de página, y agregar ese código al campo de entrada: <code> function autoId () {var autoId = ""; var dict = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789"; for (var i = 0; i <12; i ++) {autoId + = dict.charAt (Math.floor (Math.random () * dict.length)); } return autoId; } $ ('. autocompleteoff'). attr ('autocomplete', autoId ()); </code> Puede agregar la autocompleteoffclase al campo de entrada deseado.
Raghuram Kasyap

no funciona en mi Chrome versión 68.0.3440.106 (versión oficial) (64 bits)
Sukanya Purushothaman

Chrome ha sido arreglado para usar el "apagado" estandarizado ahora
MacK

1
Lamentablemente funciona mejor de lo que se llama estándar en cromo
Nour Lababidi

1
Hoy descubrí que Chrome sobrescribirá la cadena aleatoria con "Desactivado". No puedo creer que los desarrolladores de Chrome hagan este atributo malo y sin control. ¿Por qué tengo?
paso

33

Tendría que rogar que difiera con las respuestas que dicen evitar la desactivación de autocompletar.

Lo primero que debe mencionar es que el autocompletado que no se deshabilita explícitamente en los campos del formulario de inicio de sesión es un error de PCI-DSS. Además, si la máquina local de un usuario se ve comprometida, cualquier dato de autocompletado puede ser obtenido trivialmente por un atacante debido a que se almacena en la memoria.

Ciertamente hay un argumento para la usabilidad, sin embargo, hay un equilibrio muy fino cuando se trata de qué campos de formulario deberían tener autocompletado deshabilitado y cuáles no.


Me ha llamado la atención que IE no activa eventos onChange cuando llena una entrada de texto usando Autocompletar. Tenemos docenas de formularios y más de mil eventos onChange (validaciones de entrada, lógica de negocios) diseminados por todos ellos. Recientemente actualizamos IE a una versión más nueva y de repente comenzaron a suceder cosas extrañas. Afortunadamente, estamos ejecutando una aplicación de intranet y el autocompletado no es un problema de UX para nosotros, es más fácil apagarlo.
Robotron

3
Si la máquina local de un usuario se ve comprometida, se atornilla, punto. Podría tener un keylogger instalado, podría tener un certificado raíz SSL falso agregado y todo enviado a través de un proxy falso, etc. ese usuario mi nombre de usuario y contraseña de administrador. Necesito prevenir este comportamiento.
rjmunro

1
Los proveedores de navegadores parecen estar atentos a sus propios intereses. Contraseñas guardadas = bloqueo de usuario. Y la activación / desactivación de autocompletar era demasiado simple: ¿por qué no un estándar complejo de sugerencias semánticas ( html.spec.whatwg.org/multipage/… ) que, por cierto, permite al navegador recopilar datos semánticos valiosos de los sitios cada uno? visitas de usuarios?
aro_tech

El caso de uso específico que estoy tratando de resolver es el siguiente: ya están conectados. Pero ahora están a punto de acceder a algo aún más sensible. Quiero mostrar un diálogo que los haga volver a autenticarse, contra la posibilidad de que se hayan marchado a fumar y que una persona mala se haya sentado en su silla. He intentado varias técnicas para vencer el autocompletado, y nada funciona. ahora estoy pensando, tal vez, al menos, usar el viejo 'password = window.prompt ("Vuelva a ingresar su contraseña") más el nombre de usuario en la sesión, e intente autenticar eso.
David

31

Tres opciones: Primero:

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

Segundo:

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

Tercero (código javascript):

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

2
Las opciones primera y segunda deben ser una opción, ya que varía en la forma en que los navegadores manejan esto.
rybo111

Probé $ formElement.attr ('autocompletar', 'off'); y no funciona
Ben Sinclair el

22

En una nota relacionada o en realidad, en la nota completamente opuesta:

"Si usted es el usuario del formulario mencionado anteriormente y desea volver a habilitar la funcionalidad de autocompletar, use el marcador de 'recordar contraseña' de esta página de marcadores . Elimina todos los autocomplete="off"atributos de todos los formularios de la página. ¡Siga luchando por la buena batalla! "


20

Realmente usamos sasb la idea de para un sitio. Era una aplicación web de software médico para administrar el consultorio de un médico. Sin embargo, muchos de nuestros clientes eran cirujanos que usaban muchas estaciones de trabajo diferentes, incluidas terminales semipúblicas. Por lo tanto, querían asegurarse de que un médico que no comprende la implicación de las contraseñas guardadas automáticamente o que no está prestando atención no pueda dejar accidentalmente accesible su información de inicio de sesión. Por supuesto, esto fue antes de la idea de navegación privada que está comenzando a aparecer en IE8, FF3.1, etc. Aun así, muchos médicos se ven obligados a usar los navegadores de la vieja escuela en hospitales con TI que no cambiará.

Entonces, la página de inicio de sesión generó nombres de campo aleatorios que solo funcionarían para esa publicación. Sí, es menos conveniente, pero solo está golpeando al usuario sobre la cabeza por no almacenar información de inicio de sesión en terminales públicas.


20

Ninguna de las soluciones funcionó para mí en esta conversación.

Finalmente descubrí una solución HTML pura que no requiere Javascript , funciona en navegadores modernos (excepto IE; tenía que haber al menos 1 captura, ¿verdad?) Y no requiere que desactive el autocompletado para todo el formulario.

Simplemente desactive el autocompletado en formy luego actívelo para cualquiera inputque desee que funcione dentro del formulario. Por ejemplo:

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

¡Esto era totalmente lo que estaba buscando!
Marco

20

Solo establece autocomplete="off". Hay una muy buena razón para hacer esto: ¡Desea proporcionar su propia funcionalidad de autocompletar!


20

He estado probando soluciones infinitas, y luego encontré esto:

En vez de autocomplete="off" simplemente usarautocomplete="false"

¡Tan simple como eso, y funciona como un encanto en Google Chrome también!


Como dijiste en Chrome, el valor desactivado no funciona. Tiene que ser "falso"
azuax

Funciona para mí en Chrome 44.0.2403.130.
GuiGS

1
Intenté esto: $ formElement.attr ('autocomplete', 'false'); lo siento no funciona
Ben Sinclair el

20

Esto funciona para mi.

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

También podemos usar esta estrategia en otros controles como texto, seleccionar, etc.


Esta debería ser la última respuesta. la única respuesta que me funciona en el último cromo
Nick Chan Abdullah

19

Creo que autocomplete=offes compatible con HTML 5.

Sin embargo, pregúntese por qué quiere hacer esto: puede tener sentido en algunas situaciones, pero no lo haga solo por hacerlo.

Es menos conveniente para los usuarios y ni siquiera es un problema de seguridad en OS X (mencionado por Soren a continuación). Si le preocupa que las personas tengan sus contraseñas robadas de forma remota, un registrador de pulsaciones de teclas aún podría hacerlo aunque su aplicación use autcomplete=off.

Como un usuario que elige que un navegador recuerde (la mayoría de) mi información, me parecería molesto si su sitio no recordara el mío.


17

Además de

autocomplete="off"

Utilizar

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

para las entradas que no desea que recuerden datos de formulario (username , password, etc.) como se muestra a continuación:

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

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

Espero que esto ayude.


1
Para mí, en IE11, no puedo escribir en el cuadro de texto incluso después de que onfocus elimine el atributo de solo lectura. Sin embargo, si hago clic por segunda vez en el cuadro de texto, puedo escribir.
mcallahan

Me encontré con el mismo problema con IE11 (no puedo escribir hasta el segundo foco). Agregar un desenfoque y luego enfocar nuevamente funciona. $(document).on('focus', 'input:password[readonly="readonly"]', function () { $(this).prop('readonly', false).blur().focus(); });
palmsey

@ Andrew Claro, puedes. Este es el principio central para abrumar este problema y también agregué una actualización que contiene un ejemplo de código completo;)
Murat Yıldız

También he agregadoonfocusout="this.setAttribute('readonly', 'readonly');"
rinatdobr

16

La mejor solucion:

Evite el nombre de usuario (o correo electrónico) y la contraseña de autocompletar:

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

Prevenir autocompletar un campo:

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

Explicación: autocompletecontinúa trabajando en <input>, autocomplete="off"no funciona, pero puede cambiar offa una cadena aleatoria, como nope.

Trabaja en:

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

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


2
Encontré que esto funciona en mis pruebas preliminares. Tan extraño que "apagado" no funciona.
Craig Jacobs

Esto no funciona para Chrome en Android. Intenté establecer valores de cadena para el autocompleteatributo y todavía muestra entradas anteriores como sugerencias de autocompletar debajo de la entrada.
tebs1200

@ tebs1200 ¿Cuál? ¿El campo de contraseña o el campo de texto?
Cava

@Cava lo siento por la respuesta tardía. El campo de texto. No importa el valor que establezca autocomplete, todavía recibo un menú desplegable de sugerencias basado en valores ingresados ​​previamente. Está bien en el escritorio, pero no en Android Chrome.
tebs1200

14

Un poco tarde para el juego ... pero me encontré con este problema y probé varios fallos, pero este funciona para mí encontrado en MDN

En algunos casos, el navegador seguirá sugiriendo valores de autocompletado incluso si el atributo autocompletar está desactivado. Este comportamiento inesperado puede ser bastante desconcertante para los desarrolladores. El truco para forzar realmente la no terminación es asignar una cadena aleatoria al atributo de esta manera:

autocomplete="nope"

13

Agregar el

autocomplete="off"

a la etiqueta del formulario deshabilitará el autocompletado del navegador (lo que se escribió anteriormente en ese campo) de todos input campos dentro de ese formulario en particular.

Probado en:

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

13

Agregar autocomplete="off"no va a ser suficiente.

Cambie el atributo de tipo de entrada a type="search".
Google no aplica el autocompletado a las entradas con un tipo de búsqueda.


44
Es un hack. El campo no es un campo de búsqueda. En el futuro esto podría causar problemas.
Roel

12

Utilice un nombre y una identificación no estándar para los campos, de modo que en lugar de "nombre" tenga "nombre_". Los navegadores no lo verán como el campo de nombre. La mejor parte es que puede hacer esto en algunos pero no en todos los campos y completará automáticamente algunos pero no todos los campos.


El problema con esto es que si otros sitios usan "nombre_" para lograr el mismo objetivo, entonces estás de vuelta al punto de partida.
ConroyP

3
así que hazlo "mysite_name". Si alguien más está usando esto, me gustaría hacerles preguntas ...
Steve Perks

esto arruina algunas de esas utilidades de
llenado

12

Para evitar el XHTML no válido, puede establecer este atributo usando javascript. Ejemplo usando jQuery:

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

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

El problema es que los usuarios sin javascript obtendrán la funcionalidad de autocompletar.


38
esto no evita xhtml inválido, ¡simplemente agrega el bit inválido dinámicamente después de que lo haya verificado, lo declaró válido!
Andiih

@Andiih: Entonces, ¿hay alguna manera de hacer que el autocompletado funcione en xhtml?
cherouvim

1
Trabajar (o dejar de funcionar, que es el objetivo): sí, como se indicó anteriormente. Pero válido, no.
Andiih

11

intente esto también si simplemente autocomplete="off"no funciona:

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

11

No puedo creer que esto siga siendo un problema mucho después de que se haya informado. Las soluciones anteriores no funcionaron para mí, ya que Safari parecía saber cuándo el elemento no se mostraba o no estaba en la pantalla, sin embargo, lo siguiente sí funcionó para mí:

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

Espero que sea útil para alguien!


1
Entonces, ¿poner esto antes de los campos de nombre de usuario y contraseña reales funcionó? el navegador llenó esos y no los reales
Andrew

11

Entonces aquí está:

function turnOnPasswordStyle() {
  $('#inputpassword').attr('type', "password");
}
<input oninput="turnOnPasswordStyle()" id="inputpassword" type="text">


1
Parece una buena idea si los cuadros de texto de estilo evitan el destello de la contraseña visible.
Andrew

1
Muchas gracias, esto hizo el trabajo +1, mi variación a su solución fue hacerlo por una sola línea: <input oninput = "this.type = 'password'" id = "inputpassword" type = "text">
Hasnaa Ibraheem

@HasnaaIbraheem Gracias (: a veces más legible es mejor.
Stav Bodik

11

Este es un problema de seguridad que los navegadores ignoran ahora. Los navegadores identifican y almacenan contenido utilizando nombres de entrada, incluso si los desarrolladores consideran que la información es confidencial y no debe almacenarse. Hacer que un nombre de entrada sea diferente entre 2 solicitudes resolverá el problema (pero aún se guardará en la memoria caché del navegador y también aumentará la memoria caché del navegador). Pedirle al usuario que active o desactive las opciones en la configuración de su navegador no es una buena solución. El problema se puede solucionar en el backend.

Aquí está mi solución. Un enfoque que he implementado en mi marco. Todos los elementos de autocompletar se generan con una entrada oculta como esta:

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

Luego, el servidor procesa variables de publicación como esta:

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

Se puede acceder al valor como siempre

var_dump($_POST['username']);

Y el navegador no podrá sugerir información de la solicitud anterior o de usuarios anteriores.

Todo funciona de maravilla, incluso si las actualizaciones de los navegadores quieren ignorar el autocompletado o no. Esa ha sido la mejor manera de solucionar el problema para mí.


10

Ninguno de los hacks mencionados aquí me funcionó en Chrome. Aquí hay una discusión sobre el problema: https://code.google.com/p/chromium/issues/detail?id=468153#c41

Agregando esto dentro de una <form>obra (al menos por ahora):

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

1
Tenga en cuenta que al usar esta técnica, FireFox aún completará automáticamente ese campo oculto, que se incluirá al enviar el formulario. Eso probablemente sería malo, ya que la contraseña se transferiría a través de una conexión potencialmente no segura. Afortunadamente, agregar maxlength="0"evita que Firefox complete automáticamente el campo.
Mikal Schacht Jensen

9

Puede usar en la entrada.

Por ejemplo;

<input type=text name="test" autocomplete="off" />
Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.