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

Question

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

Answer 1

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

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

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

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

Answer 2

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

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

Answer 3

Большинство основных браузеров и менеджеров паролей (правильно, ИМХО) теперь игнорируют 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

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

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

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

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

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

<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. Поскольку браузер является последним экземпляром, и вы не можете им управлять,

Это исправление только для чтения сработало для меня.

Answer 5

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

Это будет работать в Internet Explorer и Mozilla FireFox, недостатком является то, что это не стандарт XHTML.

Answer 6

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

Пример:

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

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

Это хорошо работает для меня.

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

Answer 7

Как уже говорили другие, ответ: autocomplete="off"

Тем не менее, я думаю, что стоит указать , почему - это хорошая идея, чтобы использовать это в определенных случаях, так как некоторые ответы на это и дубликаты вопросов подсказали, что лучше не выключать это .

Не следует оставлять браузеры, хранящие номера кредитных карт, пользователям. Слишком много пользователей даже не осознают, что это проблема.

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

«Никогда не сохраняйте защитный код ... его значение зависит от предположения, что единственный способ предоставить его - это прочитать его с физической кредитной карты, доказав, что лицо, предоставляющее его, действительно держит карту».

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

Answer 8

Я бы попросил не согласиться с теми ответами, которые говорят, чтобы избежать отключения автозаполнения.

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

Конечно, есть аргумент для удобства использования, однако, когда дело доходит до того, какие поля формы должны иметь отключенное автозаполнение, а какие нет, *

Answer 9

Три варианта: Первый:

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

Второй:

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

Третий (код JavaScript):

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

Answer 10

Я решил бесконечный бой с Google Chrome с использованием случайных символов. Когда вы всегда визуализируете автозаполнение со случайной строкой, оно никогда ничего не запомнит.

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

Надеюсь, что это поможет другим людям.