Тип вводу = пароль, не дозволяйте браузеру запам’ятовувати пароль


101

Я пам’ятаю, бачив спосіб створити <input type="password" />такий, щоб браузер не запропонував користувачу зберегти пароль. Але я малюю пусту. Чи є атрибут HTML або якийсь фокус JavaScript, який це зробить?


Відповіді:


123

Спробуйте використовувати autocomplete="off". Не впевнений, чи підтримує його кожен браузер. Документи MSDN тут .

EDIT : Примітка. Більшість браузерів припинили підтримку цього атрибута. Див. Чи сумісне автозаповнення = "вимкнено" з усіма сучасними браузерами?

Це, мабуть, щось, що слід залишати за користувачем, а не дизайнером веб-сайтів.


2
Ви також можете доставити сторінку за допомогою HTTPS і за допомогою заголовка HTTP або тегу META запобігти кешування. Таким чином, пароль також не буде зберігатися (принаймні в Internet Explorer).
— doekman

Що стосується перевірки, HTML5 додає в специфікацію атрибут автозаповнення, тож зараз добре
— VictorySaber

9
Примітка для майбутніх читачів: Усі основні браузери рухаються до ігнорування атрибута. (Див stackoverflow.com/a/21348793/37706 )
— rdans

@RyanDansie дякую за вказівку на це. Я оновив відповідь. Стара відповідь - стара.
— tvanfosson

8
"Це, мабуть, щось, що слід залишати за користувачем, а не дизайнером веб-сайтів." Існують як технічні, так і нетехнічні причини цього. Наприклад, не слід пам'ятати про одноразові паролі. Банківські сайти з "введіть першу цифру вашого PIN-коду" - це інша. Не забувайте, що бізнес-аналітик може вирішити, що він хоче поле пароля, і видалити вибір у розробника.
— Sprague

61

<input type="password" autocomplete="off" />

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

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


23
+1 для "не дратуйте користувачів". Саме це і робить ця функція. Так само, як сайти, які змушують кешувати, так кнопка "назад" очищає форму. НАЙКРАЙНО дратує.
— Клетус

6
+1 Я повністю згоден. Це для адміністратора редагує сторінку профілю клієнта, де ви вводите пароль лише в тому випадку, якщо ви маєте намір змінити його. Таким чином адміністратори не змінюють пароль щоразу, коли вони йдуть на редагування інформації про клієнта.
— DavGarcia

14
Це дуже корисно для полів номерів кредитних карт. Форма PayPal зберігається у кожному браузері, і кожен, хто користується вашим комп'ютером, може повторно ввести всі дані, тому вам доведеться вручну перейти та видалити всі запам'ятовані поля.
— Єгор Павліхін

31
У формі, де користувач може встановити пароль, який не має нічого спільного з їх логіном, включення автозаповнення насправді є найбільш прикрим варіантом - браузер може запропонувати зберегти пароль, з яким він насправді нічого не може зробити. Крім того, якщо безпека є чутливою проблемою, я не вважаю, що всі публічні машини правильно налаштовані.
— jrb

3
Я використовую це для одноразового використання пароля. Як сказав jrb, було б дуже прикро, якби браузер його зберігав.
— Данація

12

Я вирішив іншим способом. Ви можете спробувати це.

<input id="passfld" type="text" autocomplete="off" />
<script type="text/javascript">
// Using jQuery
$(function(){                                               
    setTimeout(function(){
        $("input#passfld").attr("type","password");
    },10);
});


// or in pure javascript
 window.onload=function(){                                              
    setTimeout(function(){  
        document.getElementById('passfld').type = 'password';
    },10);
  }   
</script>

#Інший спосіб

 <script type="text/javascript">    
 function setAutoCompleteOFF(tm){
    if(typeof tm =="undefined"){tm=10;}
    try{
    var inputs=$(".auto-complete-off,input[autocomplete=off]"); 
    setTimeout(function(){
        inputs.each(function(){     
            var old_value=$(this).attr("value");            
            var thisobj=$(this);            
            setTimeout(function(){  
                thisobj.removeClass("auto-complete-off").addClass("auto-complete-off-processed");
                thisobj.val(old_value);
            },tm);
         });
     },tm); 
    }catch(e){}
  }
 $(function(){                                              
        setAutoCompleteOFF();
    });
</script>

// вам потрібно додати атрибут autocomplete = "off" або ви можете додати клас .auto-complete-off у поле введення та насолоджуватися

Приклад:

  <input id="passfld" type="password" autocomplete="off" />
    OR
  <input id="passfld" class="auto-complete-off" type="password"  />

4
Це заважає браузеру зберігати пароль, а не запобігати автозаповненню, що є кращим рішенням у моєму сценарії.
— Pau Fracés

Дякуємо, працювали для мене на останньому хромі. Примітка. Використовується у внутрішній системі, де дозволено лише Chrome, зробіть більше тестувань, якщо використовуєте їх на виробництві.
— Ізіон

@AntoVinish, я сподіваюся, що моє останнє рішення роботи в firefox 40.
— Сарвар Хасан

7

Я спробував таке, і, здається, це працює для будь-якого браузера:

<input id="passfld" type="text" autocomplete="off" />

<script type="text/javascript">
    $(function(){  
        var passElem = $("input#passfld");
        passElem.focus(function() { 
            passElem.prop("type", "password");                                             
        });
    });
</script>

Цей спосіб набагато безпечніший, ніж використання методів таймауту, оскільки він гарантує, що поле введення введеться до пароля, коли користувач фокусує його.


5

Що стосується питань безпеки, ось що вам розповість консультант з безпеки у всьому польовому питанні (це фактично незалежний аудит безпеки):

Увімкнено автоматичне заповнення HTML - у полях паролів у формах HTML увімкнено автоматичне заповнення. Більшість браузерів мають можливість запам’ятовувати облікові дані користувачів, введені у форми HTML.

Відносний ризик: низький

Уражені системи / пристрої: o https: // * ** * *** /

Я також погоджуюся, що це повинно охоплювати будь-яке поле, яке містить справді приватні дані. Я вважаю, що цілком можна змусити людину завжди вводити інформацію про свою кредитну карту, CVC-код, паролі, імена користувачів тощо, коли цей веб-сайт має доступ до всього, що повинно бути захищеним [універсально або відповідно до вимог законодавства]. Наприклад: форми покупки, банківські / кредитні сайти, податкові сайти, медичні дані, федеральні, ядерні тощо - не такі сайти, як Stack Overflow або Facebook.

Інші типи сайтів - наприклад, TimeStar Online для роботи та поза роботою - це нерозумно, оскільки я завжди використовую один і той же ПК / акаунт на роботі, що я не можу зберігати облікові дані на цьому сайті - як не дивно, я можу на своєму Android але не на iPad. Навіть на спільних ПК це не було б дуже погано, оскільки введення / вихід для когось іншого насправді нічого не робить, але дратує вашого керівника. (Вони повинні зайти і видалити помилкові удари - просто вибирайте, щоб не економити на публічних ПК).


5
Просто додавши сюди коментар з тієї причини, з якої ви не хочете зберігати пароль. Я підтримую веб-сайт з обліковими записами користувачів, де адміністратори можуть змінити пароль користувача. Наразі клієнт розлючений тим, що Chrome пропонує зберегти пароль, введений у формі "змінити пароль", кожного разу для кожного користувача , оскільки він неправильно ідентифікує форму редагування користувача як форму для входу. Надаючи прості інструкції на кшталт "просто натисніть ніколи не пам'ятати пароль", мабуть, поза ними.
— charredUtensil

5
<input type="password" placeholder="Enter New Password" autocomplete="new-password">

Ось ви йдете.


2
Це ЯК, до речі, існує багато обхідних шляхів, і це так просто, як це перевірено з останньою версією Firefox (v67) та Chrome (75).
— Маріано Руїз

Chrome 80 все ще запропонує запам'ятати пароль після надсилання форми.
— Буке

4

Ось найкраща відповідь і найпростіша! Поставте додаткове поле пароля перед вашим inputполем і встановіть display:none, щоб, коли браузер його заповнював, він inputробив це в тому, що вас не хвилює.

Змініть це:

<input type="password" name="password" size="25" class="input" id="password" value="">

до цього:

<input type="password" style="display:none;">
<input type="password" name="password" size="25" class="input" id="password" value="">

Насправді він працює, якщо два поля паролів є у формі, але новий браузер ігнорує 2-й пароль, якщо його не видно та включено; (
— Седрік Саймон

1
Використання display:noneне працює для мене (Chrome 61 OSX), але це робить:<input type="password" style="position: absolute; top: -1000px;">
— Джон Hascall

2

Прочитайте також цю відповідь, де він використовує це просте рішення, яке працює скрізь (див. Також виправлення для мобільного телефону Safari):

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

1

Ви можете використовувати JQuery, вибрати елемент за ідентифікатором:

$("input#Password").attr("autocomplete","off");

Або виберіть предмет за типом:

$("input[type='password']").attr("autocomplete","off");

Або також:

Ви можете використовувати чистий Javascript:

document.getElementById('Password').autocomplete = 'off';


1

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

Встановіть поле для пароля у звичайне текстове поле та маскуйте свої дані "дисками" за допомогою CSS. код повинен виглядати так:

<input type="text" class="myPassword" /> 

input .myPassword{
    text-security:disc;
    -webkit-text-security:disc;
    -mox-text-security:disc;
}

Зверніть увагу, що це може не працювати належним чином у веб-переглядачах Firefox, і потрібен додатковий прохід. Детальніше про це читайте тут: https://stackoverflow.com/a/49304708/5477548 .

Рішення було взято за цим посиланням , але, щоб відповідати SO "no-hotlinks", я узагальнив його тут.


0

У випадку більшості основних веб-переглядачів, які не мають жодного входу і не підключаються до будь-яких форм, що спонукає браузер думати, подання не було. У цьому випадку вам також доведеться використовувати чисту перевірку JS для свого входу та шифрування ваших паролів.

Перед:

<form action="..."><input type="password"/></form>

Після:

<input type="password"/>

1
До речі, це хитрість, яку ви, мабуть, не повинні використовувати. Якщо ви не використовуєте тег форми, ваш код стає HTML4 за замовчуванням і ускладнює перевірку акаунтів користувачів.
— Каніцид

0

Я знайшов наступні роботи на Firefox та Chrome.

<form ... > <!-- more stuff -->
<input name="person" type="text" size=30 value="">
<input name="mypswd" type="password" size=6 value="" autocomplete="off">
<input name="userid" type="text" value="security" style="display:none">
<input name="passwd" type="password" value="faker" style="display:none">
<!-- more stuff --> </form>

Все це знаходиться у розділі форм. "person" і "mypswd" - це те, що ви хочете, але браузер збереже "userid" і "passwd" один раз, і ніколи більше, оскільки вони не змінюються. Ви можете усунути поле "людина", якщо воно вам справді не потрібне. У цьому випадку все, що вам потрібно, - це поле "mypswd", яке може змінитись певним чином, відомим користувачеві вашої веб-сторінки.


0

Єдиний спосіб я можу отримати Firefox, edge та Internet Explorer вимкнути автозаповнення - додати autocomplete = "false" до моєї заяви типу:

  <form action="postingpage.php" autocomplete="false" method="post">

і я повинен додати autocomplete = "off" до мого вводу форми та змінити тип на текст Like:

     <input type="text" autocomplete="off">

Здається, що цей html-код потрібно стандартизувати з браузерами. тип форми = пароль слід переглянути, щоб він змінив налаштування браузера. Єдине питання, що у мене є, я втратив маскування вхідних даних. Але з точки зору прикрого "цей сайт не захищений" не з'являється у Firefox.

для мене це не велика справа, оскільки користувач вже автентифікований і його ім'я користувача та частина його пароля змінити


2
НЕ РОБИ ЦЬОГО. Дані все одно будуть надсилатися в прямому тексті через мережу, що полягає в першу чергу вся проблема з HTTP (не HTTPS), отже, ваше "дратівливе" попереджувальне повідомлення. Немає значення, що користувач вже має автентифікацію, оскільки людина в середині все ще може бачити дані прямого тексту, а журнал на стороні сервера може бути налаштований інакше (може зберігати заголовки запитів, тоді як взагалі є інші проблеми, якщо він би зберігав POST дані під HTTPS).
— Яків

https шифрує трафік. Якщо ви використовуєте це як частину загальнодоступного Інтернет-додатку, ви все одно зробите це. Метод публікації запобігає розміщенню закладок, а декілька iframes php-коду всередині HTML запобігає введенню URL-адреси. Технічно ви повинні встановити повний шлях. Якщо ви розгортаєтесь, я б рекомендував завантажити змінну $ _SESSION з базовим URL-адресою, записаною в тексті, замість того, щоб переглядати змінні $ _SERVER. $ _SERVER ['HTTP_HOST'] та $ _SERVER ['PHP_SELF'] слід використовувати лише в не публічних середовищах, оскільки вони мають кілька подвигів.
— drtechno

До речі, мій приклад - для закритих систем, які жодним чином не підключені до Інтернету
— drtechno

ніхто не торкався використання схеми кодування, виконаної з "java onclick", після чого надсилайте форму після процедури шифрування.
— drtechno
Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.