Czy istnieje sposób, aby zapobiec wypełnianiu przez rozszerzenie przeglądarki LastPass formularza HTML z polem wejściowym o nazwie „nazwa użytkownika”?

To jest ukryte pole, więc nie chcę, aby żadne oprogramowanie wykorzystywało to pole do swoich celów:

<input type="text" name="username" id="checkusername" maxlength="9" value="1999" class="longinput" style="display:none">

Rozwiązanie nie powinno przypominać „zmień nazwę pola wejściowego”.

Dodawanie

data-lpignore="true"

do pola wprowadzania danych wyłączało dla mnie szare pole LastPass [...].

Pochodzi z LastPass.com

Muszą być spełnione dwa warunki:

1. Formą (nie elementu) musi posiadać autocomplete="off"cechę
2. Użytkownik Lastpass musi mieć włączoną tę opcję: Settings > Advanced > Allow pages to disable autofill

Więc to zależy zarówno od użytkownika, jak i programisty.

Udało mi się mieć słowo „-search-” w identyfikatorze formularza, coś w rodzaju <form id="affiliate-search-form">- i lastpass nie dodaje swoich elementów do danych wejściowych formularza. Działa z czymś prostszym, <form id="search">ale nie działa<form id="se1rch">

Wiem, że spóźniłem się na imprezę tutaj, ale znalazłem to, kiedy próbowałem powstrzymać Lastpass przed zniszczeniem moich formularzy. @takeshin ma rację, ponieważ autouzupełnianie nie wystarczy. Skończyło się na tym, że zrobiłem hack poniżej, aby ukryć symbol. Niezbyt ładne, ale pozbyłem się ikony.

Jeśli czytają to jacyś programiści lastpass, podaj nam atrybut do użycia, abyśmy nie musieli uciekać się do takich rzeczy.

form[autocomplete="off"] input[type="text"] {
    background-position: 150% 50% !important;
}

Myślę, że lastpass honoruje autocomplete="off"atrybut dla danych wejściowych, ale nie jestem pewien w 100%.

EDYTUJ Jak inni zauważyli. działa to tylko wtedy, gdy użytkownik skonfigurował ostatnie przejście, aby to honorować.

Dla mnie pracował albo type=searchco jest równe textlub używanerole=note .

Możesz sprawdzić LastPass-JavaScript, ale jest ogromny, być może znajdziesz tam obejście, z tego, co widziałem, sprawdzają tylko typy danych wejściowych 4, więc input type=searchbyłoby jedno obejście:

!c.form && ("text" == c.type || "password" == c.type || "url" == c.type || "email" == c.type) && lpIsVisible(c))

Są to również słowa kluczowe, rolektóre wydają się ignorować:

var c = b.getAttribute("role");
switch (c) {
case "navigation":
case "banner":
case "contentinfo":
case "note":
case "search":
case "seealso":
case "columnheader":
case "presentation":
case "toolbar":
case "directory":`

Sprawdziłem LastPass ' onloadwff.js, przygotuj się na 26.960 linii kodu :)

Dodaj „szukaj”, aby wprowadzić identyfikator

<input type="text" name="user" id="user-search"/>

Trochę za późno na imprezę, ale właśnie to osiągnąłem, modyfikując formularz za pomocą:

<form autocomplete="off" name="lastpass-disable-search">

Myślę, że ten głupiec jako ostatni przechodzi do myślenia, że ​​to formularz wyszukiwania. Jednak nie działa to w przypadku pól z hasłami! Lastpass ignoruje w tym przypadku pole nazwy.

Jedynym sposobem, w jaki udało mi się to zrobić, jest dodanie następującego bezpośrednio u góry formularza:

<form autocomplete="off">
    <div id="lp" ><input type="text" /><input type="password" /></div><script type="text/javascript">setTimeout(function(){document.getElementById('lp').style.display = 'none'},75);</script>
</form>

Powoduje nieprzyjemne migotanie, ale usuwa bzdury z autouzupełnianiem - chociaż nadal wyświetla widżet „generuj hasło”. LastPass czeka, aż domready, a następnie sprawdza, czy są jakieś widoczne pola z hasłami, więc nie można ukryć ani zmniejszyć pól próbnych powyżej.

W przypadku ostatniego błędnego wydania Lastpass z października 2019 r. Ta prosta poprawka wydaje się najlepsza.

Dodaj

type="search"

do twojego wkładu.

Procedura lastpass sprawdza typeatrybut, aby określić, co zrobić z jego autouzupełnianiem, i nie robi nic w tym html5 type„wyszukiwania”. Jasne, że jest to lekko hakerskie, ale jest to zmiana w jednym wierszu, którą można łatwo usunąć, gdy naprawią błędny skrypt.

Uwaga: po wykonaniu tej czynności wprowadzone przez niektóre przeglądarki mogą wyglądać inaczej, jeśli rozpoznają rozszerzenie type atrybut. Jeśli obserwować tego, można temu zapobiec poprzez ustawienie właściwości CSS konkretnej przeglądarki -webkit-appearancei -moz-appearancedo 'none'na wejściu.

Ten kod w stylu ES6 był dla mnie pomocny, ponieważ dodał data-lpignore do wszystkich moich kontrolek wejściowych:

const elements = document.getElementsByTagName("INPUT");
for (let element of elements) {
    element.setAttribute("data-lpignore", "true");
}

Aby uzyskać dostęp do określonej kontrolki INPUT, można napisać coś takiego:

document.getElementById('userInput').setAttribute("data-lpignore", "true");

Możesz też zrobić to według nazwy klasy:

const elements = document.getElementsByClassName('no-last-pass');
for (let element of elements) {
    element.setAttribute("data-lpignore", "true");
}

Żadna z opcji tutaj (autouzupełnianie, data-lpignore itp.) Nie uniemożliwiała niestety automatycznego wypełniania moich pól formularza przez LastPass. Podjąłem się do problemu bardziej młotkiem i namezamiast tego asynchronicznie ustawiłem atrybuty wejściowe za pomocą JavaScript. Następująca funkcja zależna od jQuery (wywoływana z modułu obsługi zdarzenia onsubmit formularza) załatwiła sprawę:

function setInputNames() {
    $('#myForm input').each(function(idx, el) {
        el = $(el);
        if (el.attr('tmp-name')) {
            el.attr('name', el.attr('tmp-name'));
        }
    });
}

$('#myForm').submit(setInputNames);

W formularzu po prostu użyłem tmp-nameatrybutów zamiast równoważnych nameatrybutów. Przykład:

<form id="myForm" method="post" action="/someUrl">
    <input name="username" type="text">
    <input tmp-name="password" type="password">
</form>

Aktualizacja 2019-03-20

Nadal napotykałem trudności z powyższym ze względu na AngularJS w zależności od pól formularza posiadających nameatrybuty, aby ngMessages poprawnie przedstawiało komunikaty o błędach walidacji pól.

Ostatecznie jedynym rozwiązaniem, które udało mi się znaleźć, aby zapobiec wypełnianiu pól hasła LastPass w moim formularzu zmiany hasła, było:

1. Unikaj używania input[type=password]całkowicie AND
2. nie ma „hasła” w nazwie pola

Ponieważ w moim przypadku muszę mieć możliwość normalnego przesłania formularza, nadal korzystałem z mojego oryginalnego rozwiązania, aby zaktualizować nazwy pól „na czas”. Aby uniknąć korzystania z pól wprowadzania hasła, okazało się, że to rozwiązanie działa bardzo dobrze.

Próbowałem -search rename, ale z jakiegoś powodu nie zadziałało. Dla mnie zadziałało:

1. oznacz formularz do autouzupełniania - autocomplete = "off"
2. zmienić typ pola formularza na tekst
3. dodaj nową klasę do swojego css, aby zamaskować dane wejściowe, symuluje pole hasła
4. css bit: input.masker {-webkit-text-security: disc; }

Wypróbowane i przetestowane w najnowszych wersjach FF i Chrome.

Oto, co zadziałało, aby zapobiec wypełnianiu przez lastpass brzytwy @ Html.EditorFor box w Chrome:

Kliknij aktywną ikonę LastPass na pasku narzędzi, a następnie przejdź do Opcje konta> Preferencje rozszerzeń.

Na tym ekranie zaznacz opcję „Nie zastępuj pól, które są już wypełnione” (na dole)

Następnie kliknij „zaawansowane” po lewej stronie.

Na tym ekranie zaznacz „Respect AutoComplete = off: zezwól witrynom na wyłączanie autouzupełniania”.

Nie musiałem robić nic specjalnego w moim formularzu cshtml ASP, ale miałem wartość domyślną w formularzu dla pola @ Html.EditorFor.

Mam nadzieję, że to pomoże i zadziała dla kogoś. Nie mogłem znaleźć żadnej pomocy specyficznej dla Razor na ten problem w Internecie, więc pomyślałem, że dodam to, ponieważ odkryłem to za pomocą powyższego linku i wkładów.