Estoy usando AJAX para una validación de entrada rápida en mi página de inicio de sesión. Si todo es correcto, se redirige al usuario.
Aquí está el código:
$(form).submit(function () { $.post($(this).attr('action'), $(this).serialize(), function (data) { if (data.status == 'SUCCESS') { window.location = data.redirectUrl; } } ...Funciona muy bien en todos los navegadores. Pero hay un problema en Chrome. No ofrece guardar la contraseña.
Cuando JavaScript está desactivado, la contraseña se guarda, por lo que el problema definitivamente está en la redirección a una nueva ubicación.
¿Cómo puedo arreglar eso?
Encontré una solución sucia para este problema, insertando un iframe invisible y dirigiendo el formulario a él:
<iframe src="/blank.html" id="loginTarget" name="loginTarget" style="display:none"> </iframe> <form id="loginForm" action="/blank.html" method="post" target="loginTarget"></form>El JavaScript correspondiente:
$('#loginForm').submit(function () { $.post('/login', $(this).serialize(), function (data) { if (data.status == 'SUCCESS') { window.location = data.redirectUrl; } }) })El truco es que en realidad hay dos solicitudes realizadas. Primero, el formulario se envía a /blank.html, que será ignorado por el servidor, pero esto activa el cuadro de diálogo para guardar la contraseña en Chrome. Además, hacemos una solicitud ajax y enviamos el formulario real a /login. Dado que el objetivo de la primera solicitud es un iframe invisible, la página no se actualiza.
Por supuesto, esto es más útil si no desea redirigir a otra página. Si desea redirigir de todos modos, cambiar el atributo de acción es una mejor solución.
Editar:
Aquí hay una versión simple de JSFiddle . Al contrario de lo que se afirma en la sección de comentarios, no es necesario recargar la página y parece funcionar de manera muy confiable. Lo probé en Win XP con Chrome y en Linux con Chromium.
¿Puede cambiar el valor de action del formulario a data.redirectUrl y dejar que el formulario se envíe como de costumbre? Esto debería activar el aviso del navegador para guardar el nombre de usuario y la contraseña.
$(form).submit(function () { $.post($(this).attr('action'), $(this).serialize(), function (data) { if (data.status == 'SUCCESS') { $("form#name").attr('action', data.redirectUrl); } } ...Lea aquí: ¿por qué Chrome no reconoce este formulario de inicio de sesión? .
El comentario importante es:
Sí, no funciona cuando eliminas return false. Deberá reescribir su código. Chrome no ofrece guardar contraseñas de formularios que no se "envían" como función de seguridad. Si desea que funcione la función Guardar contraseña, tendrá que deshacerse del elegante inicio de sesión AJAX.
Por lo tanto, tal vez podría considerar eliminar el Ajax y simplemente dejar que el formulario se publique para iniciar sesión, esta será probablemente la única forma para que los usuarios que no tienen JavaScript habilitado también inicien sesión con su formulario.