Как отключить браузер Автозаполнение на поле веб-формы/ввод тега

html forms browser autocomplete


Как отключить autocomplete в основных браузерах для определенного input (или form field )?




Answer 1 nlucaroni


Firefox 30 игнорирует autocomplete="off" для паролей, решая вместо этого предложить пользователю, должен ли пароль храниться на клиенте. Обратите внимание на следующий комментарий от 5 мая 2014 года:

  • Менеджер паролей всегда запрашивает, хочет ли он сохранить пароль. Пароли не сохраняются без разрешения пользователя.
  • Мы являемся третьим браузером,реализовавшим это изменение,после IE и Chrome.

Согласно документации Mozilla Developer Network , логическое autocomplete атрибута элемента формы предотвращает кэширование данных формы в старых браузерах.

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



Answer 2 Ben Combee


В дополнение к autocomplete=off , вы также можете сделать так, чтобы имена полей формы были рандомизированы с помощью кода, который генерирует страницу, возможно, путем добавления некоторой специфичной для сеанса строки в конец имен.

Когда форма отправлена,вы можете снять эту часть,прежде чем обрабатывать ее на стороне сервера.Это не позволит веб-браузеру найти контекст для вашего поля,а также поможет предотвратить XSRF-атаки,так как злоумышленник не сможет угадать имена полей для отправки формы.




Answer 3 apinstein


Большинство основных браузеров и менеджеров паролей (правильно, IMHO) теперь игнорируют autocomplete=off .

Зачем? Многие банки и другие веб-сайты с высоким уровнем безопасности добавляли autocomplete=off на свои страницы входа «в целях безопасности», но это на самом деле снижает безопасность, поскольку заставляет людей менять пароли на этих сайтах с высоким уровнем безопасности, чтобы их было легко запомнить (и таким образом взломать ) так как автозаполнение было сломано.

Давным-давно большинство менеджеров паролей начали игнорировать autocomplete=off , и теперь браузеры начинают делать то же самое только для ввода имени пользователя / пароля.

К сожалению,ошибки в автозаполненных реализациях вставляют имя пользователя и/или пароль в несоответствующие поля формы,что приводит к ошибкам проверки формы или,что еще хуже,к случайной вставке имени пользователя в поля,которые пользователь намеренно оставил пустыми.

Что делать веб-разработчику?

  • Если вы можете хранить все поля паролей на странице самостоятельно,это отличный старт,так как кажется,что наличие поля пароля является основным триггером для автозаполнения пользователем/паролем.В противном случае,прочитайте советы ниже.
  • Safari замечает, что есть 2 поля пароля, и в этом случае отключает автозаполнение, предполагая, что это должна быть форма смены пароля, а не форма входа в систему. Поэтому обязательно используйте 2 поля пароля (новый и подтвердите новый) для любых форм, в которых вы разрешаете
  • К сожалению, Chrome 34 будет пытаться автоматически заполнять поля с помощью user / pass всякий раз, когда видит поле пароля. Это довольно плохая ошибка, которая, мы надеемся, изменит поведение Safari. Однако добавление этого в верхнюю часть формы отключает автозаполнение пароля:

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

Я еще не исследовал IE или Firefox тщательно,но буду рад обновить ответ,если у других есть информация в комментариях.




Answer 4 dsuess


Иногда даже автозаполнения = выкл бы не допустить , чтобы заполнить учетные данные в неправильных полях, но не является пользователем или поле ник.

Этот обходной путь является дополнением к посту Апинштейна о поведении браузера.

Исправить автозаполнение браузера только для чтения и установить запись на фокус (нажмите и вкладка)

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

Обновление:Мобильный Safari устанавливает курсор в поле,но не показывает виртуальную клавиатуру.Новый Fix работает,как и раньше,но работает с виртуальной клавиатурой:

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

Демонстрационная версия https://jsfiddle.net/danielsuess/n0scguv6/

// UpdateEnd

Потому что браузер автоматически вводит учетные данные в неправильное текстовое поле !?

Я замечаю это странное поведение в Chrome и Safari, когда поля пароля имеют одинаковую форму. Я полагаю, браузер ищет поле пароля для вставки сохраненных учетных данных. Затем он автоматически заполняет (просто догадываясь из-за наблюдения) ближайшее поле ввода текста, которое появляется перед полем пароля в DOM. Поскольку браузер является последним экземпляром, и вы не можете его контролировать,

Этот readonly-fix выше работал на меня.




Answer 5 Geynen


Решением для Chrome является добавление autocomplete="new-password" к паролю типа ввода. Пожалуйста, проверьте пример ниже.

Example:

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

Chrome всегда автоматически заполняет данные, если находит поле типа password , достаточно указать для этого поля autocomplete = "new-password" .

Для меня это хорошо работает.

Примечание: убедитесь, что с F12 ваши изменения вступили в силу, во многих случаях браузеры сохраняют страницу в кеше, у меня сложилось плохое впечатление, что она не работает, но браузер фактически не вносил изменения.