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

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

30 ответов


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

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

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

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

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

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


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

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

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

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

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

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

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

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


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

этот обходной путь в дополнение к сообщению апинштейна о поведении браузера.

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

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

Live Demo https://jsfiddle.net/danielsuess/n0scguv6/

// UpdateEnd

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

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

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


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

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


раствор для Хром-добавить 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, что ваши изменения вступают в силу, много раз браузеры сохраняют страницу в кэше, это дало мне плохое впечатление, что это не так работа, но браузер на самом деле не принес изменений.


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

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

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

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

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

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


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

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

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


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

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

второй:

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

третий (код javascript):

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

просто набор autocomplete="off". Для этого есть очень веская причина: вы хотите предоставить свои собственные функции автозаполнения!


Я пробовал бесконечные решения, а затем я нашел это:

вместо autocomplete="off" просто использовать autocomplete="false"

Так Просто, и он работает как шарм в Google Chrome, Как хорошо!


на связанной или на самом деле, на совершенно противоположной ноте -

" Если вы являетесь пользователем вышеупомянутой формы и хотите повторно включить функция автозаполнения, используйте "запомнить пароль" букмарклет от этого букмарклеты страница. Он удаляет все!--0--> атрибуты из всех форм на странице. Держать борьба за правое дело!"


мы действительно использовали sasb идея для одного сайта. Это было медицинское программное обеспечение веб-приложение для запуска офиса врача. Однако многие из наших клиентов были хирургами, которые использовали множество различных рабочих станций, включая полупубличные терминалы. Таким образом, они хотели убедиться, что врач, который не понимает значение автоматически сохраненных паролей или не обращает внимания, не может случайно оставить свою регистрационную информацию легко доступной. Конечно, это было до идеи частного просмотра это начинает отображаться в IE8, FF3.1, etc. Тем не менее, многие врачи вынуждены использовать старые школьные браузеры в больницах с ним, что не изменится.

Итак, у нас была страница входа в систему, генерирующая случайные имена полей, которые будут работать только для этого поста. Да, это менее удобно, но это просто ударяет пользователя по голове о том, что он не хранит информацию о входе в общедоступные терминалы.


Я думаю autocomplete=off поддерживается в HTML 5.

это менее удобно для пользователей и даже не проблема безопасности в OS X (упомянутая Сореном ниже). Если вы беспокоитесь о людях, чьи пароли украдены удаленно - регистратор нажатия клавиш все еще может сделать это, даже если ваше приложение использует autcomplete=off.

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


ни одно из решений не сработало для меня в этом разговоре.

я, наконец, нашел чистый HTML решение требует нет Javascript, работает в современных браузерах (кроме IE; должен был хотя бы 1 поймать, верно?), и не требует, чтобы вы отключили автозаполнение для всей формы.

просто выключите автозаполнение на form, а затем включите его для любого input вы хотите, чтобы он работал в форме. Для пример:

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

был нестандартным способом сделать это (я думаю, Mozilla и Internet Explorer все еще поддерживают его), но возиться с ожиданиями пользователей-плохая идея.

Если пользователь вводит свои данные кредитной карты в форме, а затем давайте кто-то другой использовать этот браузер это не ваша забота. :)


это работает для меня.

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

мы также можем использовать эту стратегию в других элементах управления, таких как text, select etc


добавлять

autocomplete="off"

чтобы тег формы отключил автозаполнение браузера (что было ранее введено в это поле) из всех input поля в этой конкретной форме.

проверено на:

  • в Firefox 3.5, 4 бета
  • Internet Explorer 8
  • Chrome

чтобы избежать недопустимого XHTML, вы можете установить этот атрибут с помощью javascript. Пример с использованием jQuery:

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

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

проблема в том, что пользователи без javascript получат функцию автозаполнения.


добавлять autocomplete="off" не прокатит.

изменить атрибут типа ввода на type="search".
Google не применяет автозаполнение к входам с типом поиска.


немного поздно для игры...но я просто столкнулся с этой проблемой и попробовал несколько неудач, но этот работает для меня, найденный на MDN

в некоторых случаях браузер будет продолжать предлагать значения автозаполнения даже если атрибут autocomplete имеет значение off. Это неожиданно поведение может быть довольно загадочным для разработчиков. Трюк, чтобы действительно заставить no-completion назначить случайную строку атрибуту вот так :

autocomplete="nope"

используйте нестандартное имя и id для полей, поэтому вместо "name" есть "name_". Браузеры не будут видеть его как поле имени. Лучше всего то, что вы можете сделать это с некоторыми, но не со всеми полями, и он будет автозаполнять некоторые, но не все поля.


попробуйте эти тоже, если просто autocomplete="off" не работает:

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

Я не могу поверить, что это еще вопрос, так долго после того, как она была объявлена. Вышеуказанные решения не работали для меня, так как safari, казалось, знал, когда элемент не отображается или не отображается на экране, однако для меня сработало следующее:

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

надеюсь, что это полезно для кого-то!


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

вот мое исправление. Подход, который я реализовал в своих рамках. Все элементы автозаполнения генерируются со скрытым входом следующим образом:

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

сервер затем обрабатывает переменные post следующим образом:

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

значение можно получить как обычно

var_dump($_POST['username']);

и браузер не сможет предложить информацию из предыдущего запроса или от предыдущих пользователей.

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


лучшее решение:

запретить автозаполнение имени пользователя (или электронной почты) и пароля:

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

запретить автозаполнение поля:

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

объяснение: autocomplete продолжает работать в <input>, autocomplete="off" не работает, но вы можете изменить off к случайной строке, как nope.

работает:

  • хром: 49, 50, 51, 52, 53, 54, 55, 56, 57, 58, 59, 60, 61, 62, 63 и 64

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


ни один из хаков, упомянутых здесь, не работал для меня в Chrome. Здесь обсуждается этот вопрос:https://code.google.com/p/chromium/issues/detail?id=468153#c41

добавление этого внутри <form> работает (по крайней мере сейчас):

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

попробуйте добавить

readonly onfocus= " это.removeAttribute ('только чтение');"

кроме

автозаполнение="от"

на вход(ы), которые вы не хотите сохранять данные форм (username, password, etc.), как показано ниже:

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

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

проверен на последних версиях основных браузеров, т. е. Google Chrome, Mozilla Firefox, Microsoft Edge, etc. и работать без любая проблема. Надеюсь, это поможет...


вы можете использовать input.

например:

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

вот это:

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