Google Chrome 拡張機能『Autofill』でパスワード自動入力

Posted by kumacchi on 2010年12月24日 , No comment

最近よく使うGoogle Chromeの拡張機能「Autofill」です。フォーム自動入力系の拡張機能です。LastPassをよく使っていましたが、あのソフトはパスワード入力欄に過剰反応しすぎでパスワード入力欄があるサイトだとウザイくらいに聞いてくるのと、既に保存しているのになんども保存するか聞いてきたり、どうでもいいサイトでは聞いてくるのに肝心の保存したいサイトで聞いてこなかったりと色々ウザイのでもっとシンプルな物を探していました。

FirefoxならInFormEnterとSecure Loginがあればフォーム入力はほとんど困らないのだけど、Chromeにも同じものが移植されるといいんですけどね。

Autofill – Google Chrome 拡張機能ギャラリー

設定は面倒ですが拡張機能の画面からオプションをクリックして設定画面に行きます。

20100750

実際の設定画面は下のような感じです。この画面をブックマークバーにブックマークしておけば便利です。

20100751

使い方

LastPassの様に自動で検知して登録してくれないので自分でHTMLソースをみて必要項目を調べて登録する必要があり面倒ですが、一度登録してしまえばあとは弄る必要もないし、なにより自分で設定する分小回りが効くのでLastPassが自動で入力出来ないサイトでも入力できるので便利です。あと設定画面がシンプルで分かりやすいのも設定画面が複雑なLastPassより好みです。

ここでは実際にFC2ブログにログインする為の設定方法を解説します。FC2のログイン画面は下のようになっていると思います。

20100747

このページのソースをブラウザのページのソース表示機能で表示します。するとこのようになっています。必要な部分を分かりやすいように色分けしています。

IDのinputタグがnameがidでtypeがtextというのとパスワードのinputタグがnameがpassでtypeがpasswordというのが分かると思います。あとログインページのURLがhttp://fc2.com/login.php?ref=blogなのでそれぞれ控えておきます。

<div id="login_jack">
    <form name="form_login" method="post" action="http://blog.fc2.com/" onSubmit="return blog_login_form_check();">
    <ul>
                        <li>メールアドレス/ブログID</li>
        <li><input name="id" type="text" id="id" value="" class="input" /></li>
        <li>パスワード</li>
        <li><input name="pass" type="password" id="pass" class="input" /></li>
        <li><label><input name="keep_login" type="checkbox" id="keep_login" onclick="alert_keep_login()" value="1" /> ログイン状態を維持</label></li>
        <li class="item"><input name="image" type="image" src="http://fc2.com/image/login_button.gif" alt="ログイン" /></li>
        <li class="item item2"><a href="http://help.fc2.com/fc2id/qa/group4/" target="_blank">[ログインできないときは？]</a></li>
        <li class="item item2"><a href="http://id.fc2.com/remind.php?switch_language=ja">[パスワードを再発行する]</a></li>
        <li class="item item2"><a href="http://blog.fc2.com/fc2id.html">ブログをFC2IDに移行するには？</a></li>
    </ul>
    <input type="hidden" name="mode" id="mode" value="login" />
    <input type="hidden" name="email" id="email" value="" />
    <input name="done" type="hidden" id="done" value="%ref%" />
    </form>
    <br />
    <div class="item"><a href="http://id.fc2.com/signup.php?switch_language=ja"><img src="http://static.fc2.com/share/fc2footermenu/blank.gif" class="NewEntry" alt="新規登録はこちら" /></a></div>
</div>

それだけ分ればあとは簡単です。

[＋]のボタンをクリックして入力フィールドを追加します。

20100753

まずはIDから

typeは「text」だったのでTypeは「text」を選択。
nameは「id」だったので Nameの欄には「id」と入力。
Valueの欄には実際に入力したいIDを入力します。ここでは仮に「kumacchi」とします。
Siteの欄にはhttp://fc2.com/login.php?ref=blogのうち「http://fc2.com/login.php」部分だけ入力します。（「fc2.com」の部分だけでも大丈夫だと思いますが、より厳密にマッチさせるにはURLは詳細に入力したほうがいいです。）
次はパスワードを入力するので再度[＋]をクリックして新しい入力フィールドを追加します。

20100754