웹 양식 필드/입력 태그에서 브라우저 자동 완성을 해제하려면 어떻게 해야 합니까?
주요 브라우저에서 특정 입력(또는 양식 필드)에 대해 자동 완료를 해제하려면 어떻게 해야 합니까?
은 Firefox 30을 무시합니다.autocomplete="off"패스워드의 경우는, 패스워드를 클라이언트에 보존할지를 유저에게 확인하는 것을 선택합니다.2014년 5월 5일부터 다음 주석을 참고하십시오.
- 비밀번호 매니저는 항상 비밀번호를 저장할지 여부를 묻습니다.비밀번호는 사용자의 허가 없이 저장되지 않습니다.
- 우리는 IE와 Chrome에 이어 세 번째 이 변경을 구현한 브라우저입니다.
Mozilla Developer Network 설명서에 따르면 Boolean 폼 요소 속성autocomplete이전 브라우저에서 양식 데이터가 캐시되지 않도록 합니다.
<input type="text" name="foo" autocomplete="off" />
「 」의 설정과 autocomplete=off폼 필드명을 페이지를 생성하는 코드로 랜덤화할 수도 있습니다.예를 들어 이름 끝에 세션 고유의 문자열을 추가하는 것이 좋습니다.
양식을 제출하면 서버 측에서 처리하기 전에 해당 부분을 제거할 수 있습니다.이렇게 하면 공격자가 양식 제출을 위한 필드 이름을 추측할 수 없기 때문에 웹 브라우저가 필드의 컨텍스트를 찾을 수 없고 XSRF 공격을 방지할 수도 있습니다.
및 매니저는 "IMHO"를 무시합니다.autocomplete=off
많은 등가 '고보안'을 했습니다. 많은 은행 및 기타 "고보안" 웹사이트가 추가되었습니다.autocomplete=off보안상의 목적으로 로그인 페이지에 액세스 할 수 있습니다만, 자동 완성 기능이 고장났기 때문에, 시큐러티가 높은 사이트의 패스워드를 변경하기 쉬워지기 때문에, 시큐러티가 저하됩니다.
는 패스워드를 무시하기 했습니다.autocomplete=off이제 브라우저는 사용자 이름/패스워드 입력에 대해서만 동일한 처리를 시작합니다.
안타깝게도 자동완성 구현의 버그로 인해 부적절한 폼필드에 사용자 이름 및 비밀번호 정보가 삽입되어 폼 검증 오류가 발생하거나 사용자가 의도적으로 공백으로 둔 필드에 실수로 사용자 이름이 삽입됩니다.
웹 개발자가 해야 할 일은?
- 모든 패스워드 필드를 페이지상에 혼자 둘 수 있다면 패스워드 필드의 존재는 사용자/패스 자동완성의 주요 트리거인 것처럼 보이기 때문에 좋은 시작입니다.그 이외의 경우는, 아래의 힌트를 참조해 주세요.
- Safari는 2개의 패스워드 필드가 있음을 인식하고 로그인 형식이 아닌 변경 패스워드 형식이어야 한다는 전제 하에 이 경우 자동완료를 디세블로 합니다.따라서 허가하는 폼에는 반드시 2개의 패스워드 필드(신규 및 신규 확인)를 사용합니다.
유감스럽게도 Chrome 34는 비밀번호 필드를 볼 때마다 사용자/패스 필드를 자동으로 채우려고 합니다.이것은 매우 나쁜 버그이므로 Safari 동작을 변경할 수 있기를 바랍니다.단, 폼의 맨 위에 이 항목을 추가하면 비밀번호 자동 채우기가 비활성화됩니다.
<input type="text" style="display:none"> <input type="password" style="display:none">
IE나 Firefox에 대해서는 아직 충분히 조사하지 않았지만, 다른 사람이 코멘트에 정보를 가지고 있다면 기꺼이 답변을 갱신하겠습니다.
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/
// 업데이트 종료
브라우저가 잘못된 텍스트 필드에 자격 정보를 자동으로 입력하기 때문입니다!?
Chrome과 Safari에서 동일한 형식의 비밀번호 필드가 있을 때 이 이상한 동작을 볼 수 있습니다.저장된 자격 증명을 삽입하기 위한 암호 필드를 브라우저가 검색한 것 같습니다.다음으로 DOM의 패스워드 필드 앞에 표시되는 가장 가까운 텍스트라이크 입력 필드를 자동으로 채웁니다(관찰에 의해 추측).브라우저가 마지막 인스턴스이기 때문에 제어할 수 없습니다.
위의 읽기 전용 수정은 나에게 효과가 있었다.
크롬을 위한 솔루션은 다음과 같습니다.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".
이건 나한테 잘 먹힌다.
참고: 변경 내용이 적용되는지 확인하십시오.대부분의 경우 브라우저는 페이지를 캐시에 저장하기 때문에 작동하지 않는다는 나쁜 인상을 주었지만 실제로 브라우저는 변경을 가져오지 않았습니다.
<form name="form1" id="form1" method="post"
autocomplete="off" action="http://www.example.com/form.cgi">
이것은 Internet Explorer 및 Mozilla Firefox에서 작동합니다.단점은 XHTML 규격이 아니라는 것입니다.
남들이 말했듯이 정답은autocomplete="off".
단, 이 질문에 대한 답변과 중복 질문으로 인해 이 기능을 끄지 않는 것이 좋다고 생각되므로 특정 경우에 이 기능을 사용하는 것이 좋은 이유를 설명할 필요가 있다고 생각합니다.
브라우저가 신용카드 번호를 저장하는 것을 막는 것을 사용자에게 맡겨서는 안 된다.너무 많은 사용자들은 그것이 문제라는 것을 깨닫지도 못할 것이다.
특히 신용카드 보안 코드 필드에서는 이 기능을 해제하는 것이 중요합니다.이 페이지에 기재되어 있는 바와 같이:
「시큐러티 코드를 보존하지 말아 주세요.그 가치는 그것을 공급하는 유일한 방법은 실제 신용카드에서 그것을 읽는 것이라는 가정에 달려 있으며, 그것을 공급하는 사람이 실제로 카드를 보유하고 있다는 것을 증명합니다."
문제는 공용 컴퓨터(사이버 카페, 도서관 등)인 경우 다른 사용자가 카드 세부 정보를 도용하기 쉬우며, 사용자의 컴퓨터에서도 악의적인 웹 사이트가 자동 완성 데이터를 도용할 수 있다는 것입니다.
상시 기능하는 솔루션
구글 크롬과의 끝없는 싸움을 랜덤 캐릭터로 해결했습니다.랜덤 문자열로 항상 자동 완성을 렌더링하면 아무것도 기억되지 않습니다.
<input name="name" type="text" autocomplete="rutjfkde">
그것이 다른 사람들에게 도움이 되기를 바랍니다.
업데이트 2022:
크롬autocomplete="new-password"크롬이 다시 다른 기능으로 바꾸면 문제가 해결되겠지만 잘 모르겠어요.
자동 완료를 해제하지 말라는 답변에는 동의하지 않을 수 없습니다.
첫 번째로 표시되는 것은 로그인 폼필드에서 명시적으로 디세블로 되어 있지 않은 자동 완성은 PCI-DSS 장애입니다.또한 사용자의 로컬 머신이 손상된 경우 공격자가 데이터를 클리어에 저장하기 때문에 자동 완성 데이터를 얻을 수 있습니다.
사용 편의성에 대한 논쟁은 분명히 있지만, 어떤 폼 필드가 자동 완성되어 있고 어떤 폼 필드가 비활성화되어 있는지와 비활성화되어 있지 않은지에 대해서는 매우 미세한 균형이 있습니다.
3가지 옵션:
첫 번째:
<input type='text' autocomplete='off' />
두 번째:
<form action='' autocomplete='off'>
세 번째(JavaScript 코드):
$('input').attr('autocomplete', 'off');
에 더하여
autocomplete="off"
사용하다
readonly onfocus="this.removeAttribute('readonly');"
데이터폼 데이터)를 기억하고 않은 username,password 을 예로 들 수 있습니다
<input type="text" name="UserName" autocomplete="off" readonly
onfocus="this.removeAttribute('readonly');" >
<input type="password" name="Password" autocomplete="off" readonly
onfocus="this.removeAttribute('readonly');" >
난 이거면 돼.
<input name="pass" type="password" autocomplete="new-password" />
텍스트, 선택 등 다른 컨트롤에서도 이 전략을 사용할 수 있습니다.
관련되거나 실제로 완전히 반대되는 어조로-
"상기 양식의 사용자이고 자동 완성 기능을 다시 사용 가능으로 설정하려면, 이 북마크렛 페이지에서 '비밀번호 기억' 북마크를 사용하십시오.모든 것을 제거합니다.
autocomplete="off"★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★!
★★★★★★★★★★를 설정해 주세요.autocomplete="off" 하는 데는 이렇게 하는 데는 충분한 이유가 있습니다.독자적인 자동 완성 기능을 제공하려고 합니다.
이 대화에서는 어떤 해결책도 나에게 효과가 없었다.
드디어 자바스크립트가 필요 없고 최신 브라우저(Internet Explorer 제외)에서 동작하며 적어도 하나의 캐치가 있어야 하며 전체 폼에서 자동완성을 해제할 필요가 없는 순수 HTML 솔루션을 찾았습니다.
기능을 됩니다.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>
난 끝없는 해결책을 시도했는데, 이걸 발견했어.
autocomplete="off" 말하면autocomplete="false"
그만큼 심플하고, 구글 크롬에서도 매력적으로 작용합니다!
실제로 sasb의 아이디어를 하나의 사이트에 사용했습니다.
그것은 진료실을 운영하기 위한 의료 소프트웨어 웹 앱이었다.그러나, 고객의 상당수는 세미 퍼블릭 터미널을 포함한 다양한 워크스테이션을 사용하는 외과의사였습니다.그래서 그들은 자동 저장된 비밀번호의 의미를 이해하지 못하거나 주의를 기울이지 않는 의사가 실수로 로그인 정보에 쉽게 접근할 수 있도록 하고 싶었습니다.
물론, 이것은 Internet Explorer 8, Firefox 3.1 등에 탑재되기 시작한 프라이빗 브라우징의 발상 이전입니다.그럼에도 불구하고 많은 의사들은 IT가 변화하지 않는 병원에서 구식 브라우저를 사용해야 합니다.
따라서 로그인 페이지에서 해당 게시물에 대해서만 사용할 수 있는 랜덤 필드 이름을 생성하도록 했습니다.네, 편리성은 떨어지지만, 공용 단말기에 로그인 정보를 저장하지 않는 것에 대해 사용자의 머리를 때리고 있습니다.
생각에는autocomplete=off5. 5에서 지원됩니다.
하지만 왜 이것을 하고 싶은지 스스로에게 물어보세요.-어떤 상황에서는 말이 될지 모르지만 단지 그것을 하기 위해서만 하지 마세요.
OS X(아래 Soren에서 언급)에서는 사용자의 편의성이 떨어지고 보안 문제도 발생하지 않습니다.로 패스워드를 당할 우려가 경우,키 앱이 패스워드를 사용하고 , 를 도난당할 수 .autcomplete=off.
브라우저에 내 정보를 저장하도록 선택한 사용자는 내 정보를 대부분 기억하지 못하면 곤란할 것입니다.
최적의 솔루션:
사용자 이름(또는 이메일) 및 암호 자동 완성 방지:
<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
파이어폭스: 44, 45, 46, 47, 48, 49, 50, 51, 52, 53, 54, 55, 56, 57 및 58
필드에 비표준 이름과 ID를 사용하여 "name_" 대신 "name_"을 사용합니다.그러면 브라우저는 이 필드를 이름 필드로 인식하지 않습니다.
이 기능의 가장 좋은 점은 일부 필드에 대해 이 작업을 수행할 수 있으며 일부 필드만 자동으로 완료할 수 있다는 것입니다.
" " " autocomplete="off"안 끊길 거예요.
변경합니다.input to " " " 。type="search".
구글은 검색의 일종인 입력에 자동 채우기를 적용하지 않습니다.
방금 이 문제에 부딪혀 몇 가지 실패를 시도했지만, 이 문제는 잘 해결됩니다(MDN에 있습니다).
경우에 따라서는 자동완료 속성이 off로 설정되어 있어도 브라우저는 자동완료 값을 계속 제시합니다.이 예상치 못한 행동은 개발자들에게 상당히 곤혹스러울 수 있다.no-complete를 실제로 강제하는 방법은 다음과 같이 임의의 문자열을 Atribut에 할당하는 것입니다.
autocomplete="nope"
추가
autocomplete="off"
에 의해 에 그것가 모든 [폼태그(Form Tag)]에서됩니다.input필드를 선택합니다.
테스트 대상:
- 파이어폭스 3.5, 4 베타판
- Internet Explorer 8
- 크롬
자, 여기 있습니다.
function turnOnPasswordStyle() {
$('#inputpassword').attr('type', "password");
}<input oninput="turnOnPasswordStyle()" id="inputpassword" type="text">비활성 XHTML을 피하기 위해 JavaScript를 사용하여 이 속성을 설정할 수 있습니다.jQuery를 사용한 예:
<input type="text" class="noAutoComplete" ... />
$(function() {
$('.noAutoComplete').attr('autocomplete', 'off');
});
문제는 JavaScript가 없는 사용자가 자동 완성 기능을 갖게 된다는 것입니다.
이것은 현재 브라우저가 무시하는 보안 문제입니다.브라우저는 개발자가 기밀 정보로 간주하여 저장해서는 안 되는 경우에도 입력 이름을 사용하여 콘텐츠를 식별하고 저장합니다.
두 요청 간에 입력 이름을 다르게 만들면 문제가 해결됩니다(그러나 여전히 브라우저 캐시에 저장되고 브라우저 캐시가 증가합니다).
브라우저 설정에서 옵션을 활성화 또는 비활성화하도록 사용자에게 요청하는 것은 좋은 해결책이 아닙니다.이 문제는 백엔드에서 해결할 수 있습니다.
여기 해결책이 있습니다.모든 자동 완성 요소는 다음과 같은 숨겨진 입력으로 생성됩니다.
<?php $r = md5(rand() . microtime(TRUE)); ?>
<form method="POST" action="./">
<input type="text" name="<?php echo $r; ?>" />
<input type="hidden" name="__autocomplete_fix_<?php echo $r; ?>" value="username" />
<input type="submit" name="submit" value="submit" />
</form>
그런 다음 서버는 다음과 같이 포스트 변수를 처리합니다. (데모)
foreach ($_POST as $key => $val) {
$newKey = preg_replace('~^__autocomplete_fix_~', '', $key, 1, $count);
if ($count) {
$_POST[$val] = $_POST[$newKey];
unset($_POST[$key], $_POST[$newKey]);
}
}
값은 평소대로 액세스할 수 있습니다.
echo $_POST['username'];
또한 브라우저는 이전 요청이나 이전 사용자의 정보를 제안할 수 없습니다.
브라우저가 자동완료 속성을 무시/존중시키는 기술을 업데이트하더라도 이 기능은 계속 작동합니다.
이것들도 한번 써보세요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>
여기에 언급된 해커들은 크롬에서 나에게 효과가 없었다.이 문제에 대해서는, 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>
내가 직접 시도해보니 상황이 바뀌어 있었다. 오래된 대답은 더 이상 통하지 않는다.
효과가 있을 거라고 확신하는 구현.Chrome, Edge 및 Firefox에서 테스트하면 효과가 있습니다.또한 이것을 시도해 보고 당신의 경험을 우리에게 말해줄 수 있습니다.
set the autocomplete attribute of the password input element to "new-password"
<form autocomplete="off">
....other element
<input type="password" autocomplete="new-password"/>
</form>
이것은 MDN에 준거하고 있습니다.
사용자가 다른 사용자의 새 비밀번호를 지정할 수 있는 사용자 관리 페이지를 정의하기 위해 암호 필드의 자동 입력을 방지하려면 다음을 사용할 수 있습니다.autocomplete="new-password"
이것은 브라우저가 준수할 필요가 없는 힌트입니다.그러나 최신 브라우저는 자동 채우기를 중지했습니다.<input>요소에는 autocomplete="new-password"가 포함되어 있습니다.
언급URL : https://stackoverflow.com/questions/2530/how-do-you-disable-browser-autocomplete-on-web-form-field-input-tags
'programing' 카테고리의 다른 글
| 모든 하위 디렉터리에 대해 git 풀 실행 (0) | 2023.04.11 |
|---|---|
| WPF에서 x:Name 속성과 Name 속성의 차이점은 무엇입니까? (0) | 2023.04.11 |
| Windows 7, 64비트, DLL 문제 (0) | 2023.04.11 |
| WPF 오류 수정 방법: "프로그램에 진입점에 적합한 정적 '메인' 메서드가 포함되어 있지 않습니다." (0) | 2023.04.11 |
| iTunes Connect:좋은 SKU를 고르는 방법 (0) | 2023.04.11 |