Отключить функциональность браузера "сохранить пароль"

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

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

наконец, я попытался просто иметь имя пользователя и пароль вне формы. К моему удивлению, это сработало! Он работал на IE6 и текущих версиях Firefox и Chrome на Linux. Я еще не проверял, но Я подозреваю, что он работает в большинстве, если не во всех браузерах (но меня не удивило бы, если бы там был браузер, который не заботился о том, нет ли формы).

вот пример кода, а также некоторые jQuery, чтобы заставить его работать:

<input type="text" id="username" name="username"/>
<input type="password" id="password" name="password"/>

<form id="theForm" action="/your/login" method="post">
  <input type="hidden" id="hiddenUsername" name="username"/>
  <input type="hidden" id="hiddenPassword" name="password"/>
  <input type="submit" value="Login"/>
</form>

<script type="text/javascript" language="JavaScript">
  $("#theForm").submit(function() {
    $("#hiddenUsername").val($("#username").val());
    $("#hiddenPassword").val($("#password").val());
  });
  $("#username,#password").keypress(function(e) {
    if (e.which == 13) {
      $("#theForm").submit();
    }
  });
</script>

просто использовать

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. и работает как обаяние. Надеюсь, это поможет...

Ну, это очень старый пост, но все же я дам мое решение, моя команда добивался долго. Мы просто добавили новое поле ввода type= "password" внутри формы и завернули его в div и сделали div скрытым. Убедитесь, что этот div находится перед фактическим вводом пароля. Это сработало для нас, и это не дало никакой опции сохранения пароля

плюх -http://plnkr.co/edit/xmBR31NQMUgUhYHBiZSg?p=preview

HTML-код:

<form method="post" action="yoururl">
      <div class="hidden">
        <input type="password"/>
      </div>
      <input type="text" name="username" placeholder="username"/>
      <input type="password" name="password" placeholder="password"/>
    </form>

CSS:

.hidden {display:none;}

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

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

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

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

Я проверил, что добавление автозаполнения="off" в теге форме во всех основных браузерах. На самом деле, большинство народов в США используют IE8 до сих пор.

1. IE8, IE9, IE10, Firefox, Safari работают нормально.

   браузер не спрашивает "сохранить пароль". Кроме того, ранее сохраненные имя пользователя и пароль не заполнены.

2. Chrome & IE 11 не поддерживает функцию автозаполнения= "выкл"
3. FF поддержка автозаполнения="выкл". но иногда сохраненные учетные данные заполняются.

обновлено 11 июня 2014

наконец, ниже представлено кросс-браузерное решение с использованием javascript, и оно отлично работает во всех браузерах.

необходимо удалить тег "форма" в форме входа в систему. После проверки на стороне клиента поместите эти учетные данные в скрытую форму и отправьте ее.

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

HTML-код

<form id="HiddenLoginForm" action="" method="post">
<input type="hidden" name="username" id="hidden_username" />
<input type="hidden" name="password" id="hidden_password" />
</form>

Username: <input type="text" name="username" id="username" onKeyPress="return checkAndSubmit(event);" /> 
Password: <input type="text" name="password" id="password" onKeyPress="return checkAndSubmit(event);" /> 
<input type="button" value="submit" onClick="return validateAndLogin();" onKeyPress="return checkAndSubmit(event);" /> 

Javascript

//For validation- you can modify as you like
function validateAndLogin(){
  var username = document.getElementById("username");
  var password = document.getElementById("password");

  if(username  && username.value == ''){
    alert("Please enter username!");
    return false;
  }

  if(password && password.value == ''){
    alert("Please enter password!");
    return false;
  }

  document.getElementById("hidden_username").value = username.value;
  document.getElementById("hidden_password").value = password.value;
  document.getElementById("HiddenLoginForm").submit();
}

//For enter event
function checkAndSubmit(e) {
 if (e.keyCode == 13) {
   validateAndLogin();
 }
}

удачи!!!

самый чистый способ-это использовать autocomplete="off" атрибут тега, но Firefox неправильно подчиняется ему при переключении полей с помощью Tab.

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

<input type="text" id="username" name="username"/>
<input type="password" id="prevent_autofill" autocomplete="off" style="display:none" tabindex="-1" />
<input type="password" id="password" autocomplete="off" name="password"/>

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

Примечание: это будет эффективно остановить автозаполнение пароля, потому что FF "сохранит" значение #prevent_autofill (который пуст) и попытается заполнить любые сохраненные пароли там, так как он всегда использует первый type="password" input он находит в DOM после соответствующего ввода "имя пользователя".

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

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

то, что я делал, - это комбинация автозаполнения="выкл" и очистка полей паролей с помощью javascript / jQuery.

пример jQuery:

$(function() { 
    $('#PasswordEdit').attr("autocomplete", "off");
    setTimeout('$("#PasswordEdit").val("");', 50); 
});

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

Если с autocomplete="off" не работает...удалите тег формы и используйте вместо него тег div, а затем передайте значения формы с помощью jquery на сервер. Это сработало для меня.

поскольку автозаполнение= " off " не работает для полей паролей, необходимо полагаться на javascript. Вот простое решение, основанное на ответах, найденных здесь.

добавьте атрибут data-password-autocomplete= " off " в поле пароля:

<input type="password" data-password-autocomplete="off">

включить следующие JS:

$(function(){
    $('[data-password-autocomplete="off"]').each(function() {
        $(this).prop('type', 'text');
        $('<input type="password"/>').hide().insertBefore(this);
        $(this).focus(function() {
            $(this).prop('type', 'password');
        });
    });     
});

это решение работает как для Chrome, так и для FF.

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

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

у меня есть работа, которая может помочь.

Вы можете сделать пользовательский шрифт hack. Итак, сделайте пользовательский шрифт, например, со всеми символами в виде точки / круга / звезды. Используйте это как пользовательский шрифт для вашего сайта. Проверьте, как это сделать в inkscape:как сделать свой собственный шрифт

затем в вашем журнале в форме используйте:

<form autocomplete='off'  ...>
   <input type="text" name="email" ...>
   <input type="text" name="password" class="password" autocomplete='off' ...>
   <input type=submit>
</form>

затем добавьте css:

@font-face {
    font-family: 'myCustomfont';
    src: url('myCustomfont.eot');
    src: url('myCustomfont?#iefix') format('embedded-opentype'),
         url('myCustomfont.woff') format('woff'),
         url('myCustomfont.ttf') format('truetype'),
         url('myCustomfont.svg#myCustomfont') format('svg');
    font-weight: normal;
    font-style: normal;

}
.password {
  font-family:'myCustomfont';
}

очень кросс-браузер совместимый. Я пробовал IE6+, FF, Safari и Хром. Просто убедитесь, что шрифт oet, который вы конвертируете, не поврежден. Надеюсь, это поможет?

Маркус поднял большой вопрос. Я решил посмотреть и вот:

единственный недостаток использования этого атрибут заключается в том, что он не является стандартным (он работает в браузерах IE и Mozilla), и приведет к проверке XHTML неудача. Я думаю, это тот случай, когда разумно нарушить валидацию однако. (источник)

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

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

вот пример (вы не можете запустить его здесь, так как действие формы не установлено в реальный скрипт входа):

<!doctype html>
<html>
<head>
  <title>Login & Save password test</title>
  <meta charset="utf-8">
  <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
</head>

  <body>
      <!-- the following fields will show on page, but are not part of the form -->
      <input class="username" type="text" placeholder="Username" />
      <input class="password" type="password" placeholder="Password" />

      <form id="loginForm" action="login.aspx" method="post">
        <!-- thw following two fields are part of the form, but are not visible -->
        <input name="username" id="username" type="hidden" />
        <input name="password" id="password" type="hidden" />
        <!-- standard submit button -->
        <button type="submit">Login</button>
      </form>

    <script>
      // attache a event listener which will get called just before the form data is sent to server
      $('form').submit(function(ev) {
        console.log('xxx');
        // read the value from the visible INPUT and save it to invisible one
        // ... so that it gets sent to the server
        $('#username').val($('.username').val());
        $('#password').val($('.password').val());
      });
    </script>

  </body>
</html>

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

Попробуйте поместить это в консоль (с jquery), прежде чем отправлять форму.

$('form').submit(function(event) {
    $(this).find('input[type=password]').css('visibility', 'hidden').attr('type', 'text');
});

проверено на Chrome 44.0.2403.157 (64-разрядная версия).

Я пробовал выше autocomplete="off" и все же что-нибудь успешное. если вы используете angular js, моя рекомендация-пойти с кнопкой и ng-click.

<button type="button" class="" ng-click="vm.login()" />

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

Спасибо за вопрос и ответы.

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

чтобы избавиться от пароля запомнить, я, наконец, обработал пароль как поле ввода и" размыл " введенный текст.

это менее "безопасно", чем собственное поле пароля, так как выбор типизированного текста покажет его как очистить текст, но пароль не запоминается. Это также зависит от активации Javascript.

вы будете иметь оценить риск использования ниже предложение против пароля запомнить вариант из навигатора.

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

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

<input style="background-color: rgb(239, 179, 196); color: black; text-shadow: none;" name="password" size="10" maxlength="30" onfocus="this.value='';this.style.color='black'; this.style.textShadow='none';" onkeypress="this.style.color='transparent'; this.style.textShadow='1px 1px 6px green';" autocomplete="off" type="text">

один из известных мне способов-использовать (например) JavaScript для копирования значения из поля пароля перед отправкой формы.

основная проблема заключается в том, что решение привязано к JavaScript.

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

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

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

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

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

1. не авторизованный доступ. Простейшей формы входа достаточно в принципе. Там иногда принимаются дополнительные меры, такие как случайные вопросы безопасности, CAPTCHAs, укрепление пароля и т. д.
2. набор нюхают. HTTPS-это необходимо, если люди заходят на ваш веб приложение публичных Wi-Fi точек доступа и т. д. Упомяните, что даже имея HTTPS, ваши пользователи должны регулярно менять свои пароли.
3. атаки. Есть два примера таких, начиная от простого кражи ваших паролей из браузера или тех, которые вы записали где-то на столе (не требует каких-либо ИТ-навыков) и заканчивая сессионной подделкой и перехватом трафика локальной сети (даже зашифрованного) и дальнейшим доступом к веб-приложению так же, как это было еще один конечный пользователь.

в этом конкретном посте я вижу неадекватные требования, предъявляемые к разработчику, которые он никогда не сможет решить из - за характера проблемы-безопасность конечного пользователя. Моя субъективная точка зрения заключается в том, что разработчик должен в основном сказать " нет " и указать на проблему требований, а не тратить время на такие задачи, честно. Это не совсем делает вашу систему более безопасной, это скорее приведет к случаям с наклейками на мониторах. К сожалению, некоторые боссы слышат только то, что хотят слышать. Однако, если бы я был вами, я бы попытался объяснить, откуда исходит фактическая проблема, и что автозаполнение="off" не решит ее, если это не заставит пользователей держать все свои пароли исключительно в голове! Разработчик со своей стороны не может полностью защитить пользователей, Пользователи должны знать, как использовать систему и в то же время не раскрывать свою конфиденциальную/безопасную информацию, и это выходит далеко за рамки аутентификации.

сталкивается с той же проблемой HIPAA и нашел относительно простое решение,

1. создайте скрытое поле пароля с именем Поля в виде массива.

   <input type="password" name="password[]" style="display:none" />
   

2. использовать один и тот же массив для поля пароля.

   <input type="password" name="password[]" />
   

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

Я попытался определить массив, например "password[part2]", но он все еще помнил. Я думаю, что он отбрасывает его, если это неиндексированный массив, потому что у него нет выбора, кроме как бросить его в первом месте.

затем вы используете свой язык программирования для доступа к массиву, например PHP,

echo $_POST['password'][1];

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

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

jQuery плагин:

https://github.com/cubiclesoft/php-flexforms-modules/blob/master/password-manager/jquery.stoppasswordmanager.js

соответствующий исходный код из приведенной выше ссылки:

(function($) {
$.fn.StopPasswordManager = function() {
    return this.each(function() {
        var $this = $(this);

        $this.addClass('no-print');
        $this.attr('data-background-color', $this.css('background-color'));
        $this.css('background-color', $this.css('color'));
        $this.attr('type', 'text');
        $this.attr('autocomplete', 'off');

        $this.focus(function() {
            $this.attr('type', 'password');
            $this.css('background-color', $this.attr('data-background-color'));
        });

        $this.blur(function() {
            $this.css('background-color', $this.css('color'));
            $this.attr('type', 'text');
            $this[0].selectionStart = $this[0].selectionEnd;
        });

        $this.on('keydown', function(e) {
            if (e.keyCode == 13)
            {
                $this.css('background-color', $this.css('color'));
                $this.attr('type', 'text');
                $this[0].selectionStart = $this[0].selectionEnd;
            }
        });
    });
}
}(jQuery));

демо:

https://barebonescms.com/demos/admin_pack/admin.php

нажмите "Добавить запись" в меню, а затем прокрутите до в нижней части страницы на "Module: Stop Password Manager".

отказ от ответственности: хотя этот подход работает для зрячих людей, могут возникнуть проблемы с программным обеспечением для чтения с экрана. Например, программа чтения с экрана может прочитать пароль пользователя вслух, так как видит текстовое поле. Также могут быть и другие непредвиденные последствия использования вышеуказанного плагина. Изменение встроенной функциональности веб-браузера должно быть сделано экономно с тестированием широкого спектра условий и edge случаи.

есть ли способ, чтобы сообщить браузеру не предлагать запоминать пароли?

веб-сайт сообщает браузеру, что это пароль, с помощью <input type="password">. Так что если вы должны сделайте это с точки зрения веб-сайта, тогда вам придется это изменить. (Очевидно, я не рекомендую это).

лучшим решением было бы настроить браузер так, чтобы он не запоминал пароли.

Если вы не хотите доверять флагу автозаполнения, вы можете убедиться, что пользователь вводит в поле с помощью события onchange. Приведенный ниже код представляет собой простую HTML-форму. Скрытый элемент формы password_edited начинается с 0. При изменении значения пароля JavaScript вверху (функция pw_edited) изменяет значение на 1. Когда кнопка нажата, она проверяет код valueenter здесь перед отправкой формы. Таким образом, даже если браузер игнорирует вас и autocompletes поле, пользователь не может пройти страницу входа в систему без ввода в поле Пароль. Кроме того, убедитесь, что поле Пароль пусто, когда фокус установлен. В противном случае, вы можете добавить символ в конец, а затем вернуться и удалить его, чтобы обмануть систему. Я рекомендую добавить autocomplete= " off " в пароль, но в этом примере показано, как работает резервный код.

<html>
  <head>
    <script>
      function pw_edited() {
        document.this_form.password_edited.value = 1;
      }
      function pw_blank() {
        document.this_form.password.value = "";
      }
      function submitf() {
        if(document.this_form.password_edited.value < 1) {
          alert("Please Enter Your Password!");
        }
        else {
         document.this_form.submit();
        }
      }
    </script>
  </head>
  <body>
    <form name="this_form" method="post" action="../../cgi-bin/yourscript.cgi?login">
      <div style="padding-left:25px;">
        <p>
          <label>User:</label>
          <input name="user_name" type="text" class="input" value="" size="30" maxlength="60">
        </p>
        <p>
          <label>Password:</label>
          <input name="password" type="password" class="input" size="20" value="" maxlength="50" onfocus="pw_blank();" onchange="pw_edited();">
        </p>
        <p>
          <span id="error_msg"></span>
        </p>
        <p>
          <input type="hidden" name="password_edited" value="0">
          <input name="submitform" type="button" class="button" value="Login" onclick="return submitf();">
        </p>
      </div>
    </form>
  </body>
</html>

autocomplete= " off " не работает для отключения менеджера паролей в Firefox 31 и, скорее всего, не в некоторых более ранних версиях.

проверка обсуждения в mozilla по этому вопросу: https://bugzilla.mozilla.org/show_bug.cgi?id=956906

мы хотели использовать второе поле пароля для ввода одноразового пароля, генерируемого токеном. Теперь мы используем текстовый ввод вместо ввода пароля. :-(

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

<input type="text" style="display:none">
<input type="text" name="OriginalLoginTextBox">

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

это отлично работает для IE11 и Chrome 44.0.2403.107

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

У меня не было никаких проблем с использованием этого метода:

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

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