非表示のパスワードを表示する方法（Webブラウザ）

ブラウザに記憶させたID・パスワードを忘れて困った経験は無いでしょうか。

 

ID・パスワードはブラウザに覚えさせており、あるサイトがリニューアルされパスワードが消えてしまっていた。もう数年前なのでパスワードが思い出せない、、、

ただ、ある別のサイトのパスワードと同じであることは覚えていたので、アクセスしたがパスワード部分が黒丸（●●●）やアスタリスク（***）になっていてわからない。。。

 

具体的には、以下の画面で「パスワードが見えればなぁ」という状況ですね。

 

僕は職業柄、競合調査をよく行うため多くのサイトにて会員登録を行っています。

セキュリティを考慮して、テスト用のID・パスワードの組み合わせを幾つか持っています。

 

ただ、その場限りのアカウントの場合は「一回だけだから適当でいいや」というように覚える気すらない状態で登録することもあります。

 

ところが、そういうサイトに限って後でもう一回見たくなり、その都度アカウントの新規登録を行っていました。

 

さすがに学習しろよってことで、今回、非表示のパスワードを表示する方法をマスターしました！

 

ということで、本日は「非表示のパスワードを表示する方法」を紹介します。

 

前提

本日紹介する方法は、「ブラウザに保存されていて、且つ、HTMLのフォームタグのinput要素がpasswordであること」が条件となります。

アプリやFlashなど特殊なフォームでは利用できません。

 

また、input要素がautocomplete=”off“となっていて、そもそもID・パスワードを保存できないようになっているものも不可能です。（銀行のオンラインバンキングのログインフォームなどはオートコンプリートをOFFにしていますね）

 

非表示のパスワードを表示する方法

僕はGoogle Chromeを利用している関係上、まずGoogle Chromeの画面で紹介します。

他ブラウザご利用の方は、以下のリンクから遷移してください。

• Safari
• Internet Explorer
• FireFox

 

では早速見ていきましょう。

ここでは僕のECのテストサイト「https://lolipop-dp25166794.ssl-lolipop.jp/ec/?page_id=5」を使っています。

 

サイトにアクセスし、パスワードの部分で右クリック後「検証」をクリックします。

 

開発者向けツール（デベロッパーツール）が表示されるので、

input type="password"

の部分を

input type="text"

に編集します。

  

 

input type=”text”に編集後、フォーカスを外すと画面にパスワードが表示されます。

 

なお、画面に表示されているID・パスワードの会員はすでに削除しているのでログインはできません。

あしからず。

 

その他のブラウザ

先程はGoogle Chromeの画面で紹介しましたが、他のブラウザを利用している方のために、他主要ブラウザの方法も紹介します。

 

Safari

サイトにアクセスし、パスワードの部分で右クリック後「要素の詳細を表示」をクリックします。

(「要素の詳細を表示」が表示されない方はコチラ）

 

開発者向けツール（デベロッパーツール）が表示されるので、

input type="password"

の部分を

input type="text"

に編集します。

 

input type=”text”に編集後、フォーカスを外すと画面にパスワードが表示されます。

 

Safariの開発者向けツールの表示方法

以下の画面キャプチャのように、ブラウザで右クリック後「要素の詳細を表示」が表示されない場合は、開発者向けツールの表示がオフになっているので、オンにしてあげる必要があります。

以下、オンにする方法を紹介します。

 

左上のメニュー「Safari」から「環境設定」をクリックします。

 

「詳細」タブの一番下にある「メニューバーに” 開発”メニューを表示」にチェックを入れます。

 

すると、ブラウザで右クリックした際に「要素の詳細を表示」が表示されます。

 

Internet Explorer

我が家のWindowsは、OSがWindows 10なのでEdgeの画面で紹介していきます。

 

サイトにアクセスし、パスワードの部分で右クリック後「要素の検査」をクリックします。

 

開発者向けツール（デベロッパーツール）が表示されるので、

input type="password"

の部分を

input type="text"

に編集します。

 

input type=”text”に編集後、フォーカスを外すと画面にパスワードが表示されます。

 

FireFox

サイトにアクセスし、パスワードの部分で右クリック後「要素を調査」をクリックします。

 

開発者向けツール（デベロッパーツール）が表示されるので、

input type="password"

の部分を

input type="text"

に編集します。

 

input type=”text”に編集後、フォーカスを外すと画面にパスワードが表示されます。

 

最後に

今回紹介した方法以外に、各ブラウザで保存しているすべてのID・パスワードが一覧で確認する方法があります。

（例えば、Google Chromeでは「passwords.google.com」にアクセスすれば一覧が表示されます）

 

どちらの方法も対して難しいことはないので、覚えてしまえば誰でもできます。

 

そのため、自分がちょっと離席した隙に、悪意ある第三者にパスワードを見られる可能性は大いにあります。

 

インターネット喫茶などは、離席した隙に置き引きにあったりすることがよくあるそうなので、「ECサイトなどを利用し、ブラウザに入力したパスワードを取得される」なんてことも起きているかもしれません）

 

このオートコンプリート機能（自動保存機能）はとても便利ですが、その分リスクも高いです。

 

盗まれてからでは遅いので、定期的にパスワードをクリアするなど管理の徹底をしましょう。