브라우저 '비밀번호 저장'기능 비활성화

정부 의료 기관에서 일하는 기쁨 중 하나는 PHI (Protected Health Information)와 관련된 모든 편집증을 다루어야한다는 것입니다. 잘못 이해하지 마십시오. 저는 사람들의 개인 정보 (건강, 재정, 서핑 습관 등)를 보호하기 위해 가능한 모든 것을 다하고 있지만 때로는 사람들이 너무 겁에 질려 있습니다.

적절한 사례 : 최근 주 고객 중 한 명이 브라우저가 비밀번호를 저장하는 편리한 기능을 제공한다는 것을 알게되었습니다. 우리는 그것이 한동안 존재 해 왔으며 완전히 선택적인 것이며, 사용하기에 현명한 결정인지 아닌지를 결정하는 것은 최종 사용자의 책임입니다. 그러나 현재 약간의 소란이 있으며 사이트에서 해당 기능을 비활성화 할 수있는 방법을 찾아야합니다.

질문 : 사이트가 브라우저에 비밀번호를 기억하지 말라고 알려주는 방법이 있습니까? 나는 오랫동안 웹 개발을 해왔지만 이전에 그런 것을 보지 못했다.

도움을 주시면 감사하겠습니다.

모든 브라우저에서 작동하는지 확실하지 않지만 양식에서 autocomplete = "off"를 설정해야합니다.

<form id="loginForm" action="login.cgi" method="post" autocomplete="off">

양식 및 비밀번호 저장 프롬프트 를 사용하지 않고 세션 히스토리에서 양식 데이터가 캐시되지 않도록 하는 가장 쉽고 간단한 방법 은 값이 "off"인 자동 완성 양식 요소 속성을 사용하는 것입니다.

에서 http://developer.mozilla.org/En/How_to_Turn_Off_Form_Autocompletion

일부 사소한 연구에 따르면 이것이 IE에서 작동하지만 보증하지는 않습니다.)

@Joseph : 실제 마크 업과 함께 XHTML 유효성 검사를 통과 해야하는 엄격한 요구 사항 인 경우 (왜 그런지 모르겠습니다) 나중에 이론적으로 자바 스크립트 로이 속성을 추가 할 수 있지만 js가 비활성화 된 사용자는 무시할 수 있습니다. 또는 사이트에 js가 필요한 경우 0) 여전히 비밀번호가 저장됩니다.

jQuery를 사용한 예 :

$('#loginForm').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');" >

주요 브라우저의 최신 버전, 즉 테스트 Google Chrome, Mozilla Firefox, Microsoft Edge, 등을 마법처럼 작동합니다. 도움이 되었기를 바랍니다.

나는이 문제로 어려움을 겪고 있었고, 문제에 대한 독특한 왜곡으로. 권한이있는 사용자는 저장된 암호를 사용할 수 없지만 일반 사용자가 필요했습니다. 이는 권한이있는 사용자가 두 번 로그인해야했으며 두 번째로 저장된 비밀번호를 적용하지 않았 음을 의미합니다.

이 요구 사항 autocomplete="off"을 사용하면 첫 번째 로그인에서 비밀번호가 저장되었을 수 있으므로 표준 방법이 모든 브라우저에서 작동하지는 않습니다. 동료가 비밀번호 필드가 새 비밀번호 필드에 초점을 맞췄을 때이를 대체하는 솔루션을 찾은 다음 새 비밀번호 필드에 초점을 맞춘 다음 동일한 이벤트 핸들러를 연결합니다. 이것은 IE6에서 무한 루프를 일으킨 것을 제외하고는 효과가있었습니다. 어쩌면 그 주위에 방법이 있었지만 편두통을 일으켰습니다.

마지막으로 양식 외부에 사용자 이름과 비밀번호를 넣으려고했습니다. 놀랍게도 이것이 효과가있었습니다! IE6 및 Linux의 최신 버전의 Firefox 및 Chrome에서 작동했습니다. 더 이상 테스트하지는 않았지만 모든 브라우저가 아니라면 대부분 작동한다고 생각합니다 (그러나 폼이없는 경우 신경 쓰지 않는 브라우저가 있으면 놀라지 않을 것입니다).

다음은 일부 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>

글쎄, 아주 오래된 게시물이지만 여전히 팀이 오랫동안 달성하려고했던 솔루션을 제공 할 것입니다. 방금 양식 안에 새로운 input 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의 비밀번호를 볼 수 있지만 동일한 비밀번호 인지 확신 할 수 없습니다 . 아마도 다른 것을 제어하고있을 것입니다.

업데이트 : 이것은 다른 사람들이 지적한 이유로 자동 완성 또는 다른 전술을 대체하는 것이 아니라 자동 완성 또는 다른 전술 을 사용 하는 것에 추가 해야합니다 .

또한 이는 브라우저 가 암호 를 자동 완성 하는 것을 막을뿐입니다 . 브라우저가 사용하기로 선택한 보안 수준에 관계없이 암호 를 저장 하는 것을 막지 않습니다 .

실제 2 단계 인증 을 사용 하여 사용자 브라우저 캐시보다 더 많은 위치에 저장 될 수있는 비밀번호에 대한 단독 의존을 피하십시오.

가장 확실한 방법은 autocomplete="off"tag 속성 을 사용하는 것이지만 Tab으로 필드를 전환 할 때 Firefox가 태그 속성을 올바르게 따르지 않습니다.

이것을 막을 수있는 유일한 방법은 가짜 숨겨진 암호 필드를 추가하여 브라우저가 암호를 채우도록 속이는 것입니다.

<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""각각의"사용자 이름 "다음에 DOM에서 찾은 첫 번째 입력을 사용 하기 때문에 암호 자동 완성을 중지합니다. 입력.

모든 주요 브라우저에서 양식 태그에 autocomplete = "off"를 추가하는 것을 테스트했습니다. 실제로 미국의 대부분의 사람들은 지금까지 IE8을 사용하고 있습니다.

1. IE8, IE9, IE10, Firefox, Safari는 잘 작동합니다.

   브라우저가 "암호 저장"을 요구하지 않습니다. 또한 이전에 저장된 사용자 이름 및 비밀번호가 채워지지 않았습니다.

2. Chrome 및 IE 11은 autocomplete = "off"기능을 지원하지 않습니다
3. FF는 autocomplete = "off"를 지원합니다. 그러나 때로는 기존의 저장된 자격 증명이 채워집니다.

2014 년 6 월 11 일에 업데이트 됨

마지막으로 아래는 자바 스크립트를 사용하는 크로스 브라우저 솔루션이며 모든 브라우저에서 제대로 작동합니다.

로그인 양식에서 "form"태그를 제거해야합니다. 클라이언트 측 유효성 검증 후 해당 신임 정보를 숨겨진 양식으로 넣고 제출하십시오.

또한 두 가지 방법을 추가하십시오. 하나는 "validateLogin ()"유효성 검사를위한 것이고 다른 하나는 텍스트 상자 / 비밀번호 / 버튼 "checkAndSubmit ()"에서 enter를 클릭하는 동안 enter 이벤트 수신을위한 것입니다. 이제 로그인 양식에 양식 태그가 없으므로 여기에서 이벤트가 작동하지 않습니다.

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

자바 스크립트

//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"와 javascript / jQuery를 사용하여 암호 필드를 지우는 것입니다.

jQuery 예 :

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

를 사용 setTimeout()하면 필드를 지우기 전에 브라우저가 필드를 완료 할 때까지 기다릴 수 있습니다. 그렇지 않으면 필드를 지우면 브라우저가 항상 자동 완성됩니다.

autocomplete = "off"가 작동하지 않으면 ... 양식 태그를 제거하고 대신 div 태그를 사용하고 jquery를 사용하여 양식 값을 서버에 전달하십시오. 이것은 나를 위해 일했습니다.

비밀번호 필드에는 autocomplete = "off"가 작동하지 않으므로 반드시 자바 스크립트를 사용해야합니다. 여기에있는 답변을 기반으로 한 간단한 솔루션이 있습니다.

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에서는)로 비밀번호를 보호하는 것입니다.

해결 방법이 있는데 도움이 될 수 있습니다.

사용자 정의 글꼴 해킹을 만들 수 있습니다. 예를 들어, 모든 문자를 점 / 원 /별로하여 사용자 정의 글꼴을 만드십시오. 웹 사이트의 맞춤 글꼴로 사용하십시오. 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 및 Chrome을 사용해 보았습니다. 변환 한 oet 글꼴이 손상되지 않았는지 확인하십시오. 도움이 되길 바랍니다.

이 문제를 해결하는 가장 간단한 방법은 INPUT 필드를 FORM 태그 외부에 배치하고 FORM 태그 안에 두 개의 숨겨진 필드를 추가하는 것입니다. 그런 다음 양식 데이터가 서버에 제출되기 전에 제출 이벤트 리스너에서 가시적 입력에서 보이지 않는 값으로 값을 복사합니다.

다음은 예입니다 (양식 동작이 실제 로그인 스크립트로 설정되어 있지 않으므로 여기서 실행할 수 없습니다).

<!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) 해결 방법은 비밀번호 입력 유형을 제출 양식의 텍스트 로 변경하는 것 입니다. 암호가 1 초 동안 표시 될 수 있으므로 그 직전의 입력도 숨 깁니다. 오히려 로그인 양식에 이것을 사용하지 않지만 웹 사이트의 관리 부분과 같이 유용합니다 (autocomplete = "off"와 함께).

양식을 제출하기 전에 이것을 콘솔 (jquery 사용)에 넣으십시오.

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

Chrome 44.0.2403.157 (64 비트)에서 테스트되었습니다.

많은 솔루션을 테스트했습니다. 동적 비밀번호 필드 이름, 다중 비밀번호 필드 (가짜 비밀번호에는 표시되지 않음), 입력 유형을 "text"에서 "password", autocomplete = "off", autocomplete = "new-password"로 변경했지만 최근에는 해결되지 않았습니다. 브라우저.

비밀번호를 기억하기 위해 비밀번호를 입력 필드로 처리하고 입력 한 텍스트를 "흐리게"처리했습니다.

입력 한 텍스트를 선택하면 일반 텍스트로 표시되기 때문에 기본 암호 필드보다 "안전"하지 않지만 암호는 기억되지 않습니다. 또한 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">

마르쿠스는 좋은 지적을했습니다. autocomplete속성 을 조회하기로 결정 하고 다음을 얻었습니다.

이 속성을 사용하는 유일한 단점은 표준이 아니며 (IE 및 Mozilla 브라우저에서 작동 함) XHTML 유효성 검사가 실패한다는 것입니다. 그러나 이것이 유효성 검사를 중단하는 것이 합리적인 경우라고 생각합니다. ( 소스 )

따라서 전체 보드에서 100 % 작동하지는 않지만 주요 브라우저에서 처리되므로 훌륭한 솔루션이라고 말해야합니다.

나는 위의 시도를했지만 autocomplete="off"여전히 성공했습니다. 각도 js를 사용하는 경우 버튼과 ng-click을 사용하는 것이 좋습니다.

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

누군가 이미 수락 된 답변으로 문제를 해결할 수 없다면 내 메커니즘으로 갈 수있는 경우 이것을 추가하여 이미 받아 들인 대답이 있습니다.

질문과 답변에 감사드립니다.

내가 아는 한 가지 방법은 양식을 제출하기 전에 JavaScript를 사용하여 비밀번호 필드에서 값을 복사하는 것입니다.

이것의 주요 문제는 솔루션이 JavaScript와 관련되어 있다는 것입니다.

그런 다음 JavaScript에 연결할 수 있으면 서버에 요청을 보내기 전에 클라이언트 측에서 비밀번호를 해시 할 수도 있습니다.

실제 문제는 HTML에 속성을 추가하는 것보다 훨씬 깊습니다. 이것은 일반적인 보안 문제이므로 사람들이 하드웨어 키와 기타 보안을 위해 미친 것들을 발명했습니다.

모든 브라우저에서 autocomplete = "off"가 완벽하게 작동한다고 가정 해보십시오. 보안에 도움이 되겠습니까? 물론 아니에요 사용자는 모든 사무실 방문자가 볼 수있는 모니터에 부착 된 스티커에 교과서와 암호를 적어 바탕 화면의 텍스트 파일 등에 저장합니다.

일반적으로 웹 응용 프로그램 및 웹 개발자는 최종 사용자 보안에 대해 책임을지지 않습니다. 최종 사용자는 자신 만 보호 할 수 있습니다. 이상적으로는 모든 비밀번호를 헤드에 보관하고 비밀번호를 잊어 버린 경우 비밀번호 재설정 기능을 사용하거나 관리자에게 문의해야합니다. 그렇지 않으면 항상 암호를보고 도난 당할 위험이 있습니다.

따라서 하드웨어 키가있는 미친 보안 정책이 있거나 (일부 은행은 기본적으로 2 단계 인증을 사용하는 인터넷 뱅킹을 제공합니다) 기본적으로 보안이 없습니다. 물론 이것은 약간 과장된 것입니다. 무엇을 보호하려고하는지 이해하는 것이 중요합니다.

1. 권한이없는 액세스입니다. 가장 간단한 로그인 양식이면 충분합니다. 무작위 보안 질문, 보안 문자, 비밀번호 강화 등과 같은 추가 조치가있는 경우가 있습니다.
2. 자격 증명 스니핑. 사람들이 공용 Wi-Fi 핫스팟 등에서 웹 응용 프로그램에 액세스하는 경우 HTTPS는 필수입니다. HTTPS가 있더라도 사용자는 정기적으로 암호를 변경해야합니다.
3. 내부자 공격. 브라우저에서 암호를 간단하게 훔치거나 책상에 어딘가에 적어 놓은 암호 (IT 기술이 필요하지 않음)부터 세션 위조 및 로컬 네트워크 트래픽 차단 (암호화)으로 끝나는 두 가지 예가 있습니다. 다른 최종 사용자와 마찬가지로 웹 응용 프로그램에 추가로 액세스합니다.

이 특정 게시물에서 개발자의 부적절한 요구 사항을 확인할 수 있습니다.이 요구 사항은 최종 사용자 보안 문제로 인해 해결할 수 없습니다. 내 주관적인 요점은 개발자가 기본적으로 그러한 작업에 시간을 낭비하지 않고 NO라고 말하고 요구 사항 문제를 지적해야한다는 것입니다. 이것은 시스템을 더 안전하게 만드는 것이 아니라 모니터에 스티커가 붙어있는 경우로 이어질 것입니다. 불행히도 일부 보스는 듣고 싶은 것만 듣습니다. 그러나 내가 당신이라면 실제 문제가 어디에서 왔는지 설명하려고 시도하고 autocomplete = "off"는 사용자가 모든 암호를 머리에 독점적으로 보관하지 않으면 해결하지 못합니다! 결국 개발자는 사용자를 완전히 보호 할 수 없습니다.

동일한 HIPAA 문제에 직면하고 비교적 쉬운 해결책을 찾았습니다.

1. 필드 이름을 배열로하여 숨겨진 비밀번호 필드를 작성하십시오.

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

2. 실제 비밀번호 필드에 동일한 배열을 사용하십시오.

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

브라우저 (Chrome)에서 "비밀번호 저장"을 요청하는 메시지가 표시 될 수 있지만 사용자가 저장을 선택하더라도 다음에 비밀번호를 로그인하면 숨겨진 비밀번호 필드 인 배열의 0 슬롯이 자동으로 채워져 첫 번째 슬롯은 비워집니다.

"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

메뉴에서 "항목 추가"를 클릭 한 다음 페이지 맨 아래로 스크롤하여 "모듈 : 비밀번호 관리자 중지"로 이동하십시오.

면책 조항 :이 방법은 시력이 좋은 개인에게 효과적이지만 화면 판독기 소프트웨어에 문제가있을 수 있습니다. 예를 들어, 스크린 리더에는 일반 텍스트 필드가 표시되므로 사용자의 비밀번호를 크게 읽을 수 있습니다. 위 플러그인을 사용하면 예상치 못한 다른 결과가 발생할 수도 있습니다. 내장 된 웹 브라우저 기능의 변경은 다양한 조건 및 엣지 사례를 테스트하면서 드물게 수행해야합니다.

사이트가 브라우저에 비밀번호를 기억하지 말라고 알려주는 방법이 있습니까?

웹 사이트는를 사용하여 브라우저에 비밀번호임을 알려줍니다 <input type="password">. 따라서 웹 사이트 관점에서이 작업을 수행 해야하는 경우 이를 변경해야합니다. (분명히 권장하지 않습니다).

가장 좋은 해결책은 사용자가 브라우저를 구성하여 암호를 기억하지 않도록하는 것입니다.

자동 완성 플래그를 신뢰하지 않으려면 사용자가 onchange 이벤트를 사용하여 상자에 입력하도록 할 수 있습니다. 아래 코드는 간단한 HTML 양식입니다. 숨겨진 양식 요소 password_edited는 0으로 설정되어 시작됩니다. 비밀번호 값이 변경되면 맨 위에있는 JavaScript (pw_edited 함수)가 값을 1로 변경합니다. 버튼을 누르면 양식을 제출하기 전에 여기에서 값 입력 코드를 확인합니다. . 이렇게하면 브라우저가 사용자를 무시하고 필드를 자동 완성하더라도 사용자는 비밀번호 필드에 입력하지 않으면 로그인 페이지를 전달할 수 없습니다. 또한 포커스가 설정되면 비밀번호 필드를 비워야합니다. 그렇지 않으면 끝에 문자를 추가 한 다음 돌아가서 제거하여 시스템을 속일 수 있습니다. 비밀번호에 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 기반 브라우저)에서 성공적으로 작동 한 또 다른 방법은 임의로 생성 된 접두어를 세션 상태 (또는 숨겨진 필드)에 저장하는 것입니다. 이미 세션 상태의 적절한 변수)를 사용하여 필드 이름을 변경하십시오. 주현절은 여전히 ​​암호를 저장하려고하지만 양식으로 돌아 가면 필드가 채워지지 않습니다.

이 방법을 사용하는 데 아무런 문제가 없었습니다.

autocomplete = "off"를 사용하고 숨겨진 비밀번호 필드를 추가 한 다음 숨겨지지 않은 다른 비밀번호 필드를 추가하십시오. 브라우저는 autocomplete = "off"를 고려하지 않으면 숨겨진 브라우저를 자동 완성하려고합니다.

또 다른 해결책은 모든 입력이 숨겨진 유형 인 숨겨진 양식을 사용하여 POST를 만드는 것입니다. 보이는 형식은 "password"유형의 입력을 사용합니다. 후자의 양식은 제출되지 않으므로 브라우저가 로그인 작업을 전혀 가로 챌 수 없습니다.