Chromeの拡張作ろうぜ!

この日記では10年に1度ってくらい超レアな技術系の話題。
簡単なGoogle Chromeの拡張を作るのは簡単です。本当に簡単です。
ちょっと作り方をぐぐってみると分かると思いますが、JavaScriptの知識があるユーザーなら
初見で30分ぐらいあれば、作ってみるテストが作れます。
JavaScriptの知識が無くてもプログラム経験があるのなら、基本ぐらいは一緒に覚えてしまいませう。


「いやオレ拡張機能公開する予定なんかねーし、他人の為に何かするようなガラじゃねーし」
という照れ屋は多いと思いますが、そうでなくて主に己のブラウジング生活が快適になる可能性が
あるので覚えるといいです。


以下、超単純な拡張機能の作り方。

1.フォルダを切ります

「c:\oreno\hajimete」とか。

2.フォルダ内にmanifest.jsonというファイルをを作ります

メモ帳で編集してもいいですが、文字コードUTF-8で保存しないとダメだよ!
内容は以下のように。

{
	"name": "オレの拡張機能",
	"version": "0",
	"content_scripts": [ {
		"js": [ "oreno.js" ],
		"matches": [ "https://accounts.google.com/ServiceLogin*" ],
		"run_at": "document_end"
	} ]
}

ちょっと長いけど頑張れ。

3.フォルダ内にoreno.jsというファイルをを作ります

内容は以下のように。

document.getElementById("Email").value='ore20111127@gmail.com';
document.getElementById("Passwd").value='p@zzw0rd!!unko';

※2011/11/26時点で実在しないアカウントなのでこの記事を見てログインを試みるのは止めましょう
※このパスワードは私自身使った事の無いものなので悪用を考えるのは止めましょう

4.Chromeの「chrome://settings/extensionSettings」(拡張機能の設定画面)で

デベロッパーモード」にチェックを入れ、「パッケージ化されていない拡張機能を読み込む」ます。
フォルダ「c:\oreno\hajimete」を選択します。

5.動かして喜ぶ

https://accounts.google.com/ServiceLogin
に行くと、ユーザー名とパスワードが自動的に入力されるという寸法です。


この程度の手間でできるのだから、覚えておいて損はないテクニックと言えます。
要素のID等の調査には、Chromeデベロッパーツールを使いましょう。
短いJavaScriptをテスト実行してみたい場合は、JavaScriptコンソールを使いましょう。
他ブラウザとの互換性を考慮する必要は無いので、気楽に書いて下さい。


とまあ一通り書いてえらい今更なネタだなと思ったりもしたけれどいいや投稿しちまえ。
要するにソフトウェア作家向けのみの機能って訳では無いんだねと言いたかったのです。