パスフレーズの入力内容を確認出来る様にする

パスワードからパスフレーズへ

あのパスワード規則、実は失敗作だった数字・記号・大文字の組み合わせ、2003年に考案した人物が後悔しているらしい。

• パスワードのルールは間違いだった
• 「NISTスペシャルパブリケーション800-63」は今年2017年6月に全面改定
• 「パスワード」ではなく、スペースも入れられる最低64文字の「英単語の組み合わせによるパスフレーズ」の使用を推奨
• ユーザーがパスワードを変更すべきなのは、盗まれた兆候があった時だけ

ログイン画面

なが〜いパスフレーズ（漢字を含む）を入力できる様にすると入力内容を確認したくなるのでパスフレーズを確認出来る様にした。

チェックボックスのクリックでパスワードの表示を切り替えるサンプル画面

Index: templates/auth/login.html.ep
===================================================================
--- templates/auth/login.html.ep   (revision 145)
+++ templates/auth/login.html.ep   (working copy)
@@ -6,8 +6,21 @@
  <br>Name:
  %= text_field 'user',size => 60
  <br>password:
- %= text_field 'passwd',size => 60
+ %= text_field 'passwd',size => 60,id=>"passwd"
  <br>
+ <input type="checkbox" id="password-check" checked="checked">パスワードを表示する
+ <br>
  %= submit_button 'Login'
  %= hidden_field url => $url
 % end
+<script>
+ const pwd = document.getElementById('password');
+ const pwdCheck = document.getElementById('password-check');
+ pwdCheck.addEventListener('change', function() {
+     if(pwdCheck.checked) {
+         passwd.setAttribute('type', 'text');
+     } else {
+         passwd.setAttribute('type', 'password');
+     }
+ }, false);
+</script>

• アンドロイドではpassword fieldでは日本語がいれられないのね、どうしよう・・・