読者です 読者をやめる 読者になる 読者になる

風柳メモ

ソフトウェア・プログラミング関連の覚書が中心。

Twitterのタイムラインに名前を表示するユーザーサイドスクリプトのGoogle Chrome拡張機能版作成


こんな感じに、Twitterのタイムラインに名前(プロフィールに登録したもの)を表示するスクリプトのChrome拡張機能版を作ってみました。

https://chrome.google.com/extensions/detail/bfgemfmdlogomlcpdclpmjpgmjmmpnga

からインストールできると思います。
「Google Chrome の設定」(スパナマーク)→「拡張機能(E)」で、TwSwapNameの[オプション]ボタンを押すと、

  1. 文頭表示を変えてフッタにユーザー名を挿入
  2. フッタにのみ名前を挿入

のどちらかを選ぶ画面がでてきます(オプションはこれだけです)。
なお、Google Chrome 4.1.249.1064 でしか動作確認してません。

GreasemonkeyやSeaHorse、Operaは以前の記事の通り

インストール:TwSwapName.user.js

からどうぞ。

経緯など

id:mi2maru さんより、

インストール後にファイルの編集をどの様にすればいいかわかりません

http://d.hatena.ne.jp/furyu-tei/20100202/1265112129#c1273480034

とコメントいただいたのですが、自分もわからなかったので(苦笑)。


ちなみに Chrome は、なにげに *.user.js のリンクをクリックしたり、*.user.js ファイルをドラッグ&ドロップしたりすると、ユーザサイドスクリプトとみなして、けなげにインストールしようとするのですよね。
なので最初は
「ローカルにダウンロードしたものを編集して、ドラッグアンドドロップして下さい。」
と返すつもりだったのですが、やってみると動かなかった、という(笑)。

やむを得ず(?)、Chrome拡張機能作成の練習も兼ねて、調べはじめた、というわけです。

覚書など

  • 元ページのwindowオブジェクトは、content_scriptsからは参照できない。今回の場合は、Twitterのページで既に読み込まれているjQueryの関数等も見えないため、別途jQueryを読み込む必要が有った*1
  • page間での通信はまぁ、Message Passing - Google Chrome Extensions - Google Codeを見なさい、ということかな。
  • パラメータの読み書きに使用するlocalStorageも、元ページからは参照できない(localStorageオブジェクトそのものはなぜか見えるが、パラメータはundefined)。なので、options_pageで変更したパラメータを読もうとすると、content_scriptsとbackground_pageとの間で通信をする必要があるみたいなのだけれど、これが非同期通信しかできなそうなので、content_scriptsでパラメータを読み出してすぐに処理を続けたいようなときにちょっと困りそう。上手いやり方あるのかな?
  • 拡張機能をGoogle chrome extensionsに登録しようとすると、ZIPのアップロードで失敗することがあった( "An error occurred: please try again later.")。何回も失敗したから作りが悪いのかと思ったけれど、その後同じZIPファイルで成功したので、エラー内容の通り、Googleの機嫌が悪かった(?)だけ、らしい。

それにしても、スクリプトひとつ書けば済むGreasemonkeyなんかと違って、いろいろ準備が必要な分、面倒くさいかも*2

*1:一応background_page等からはchrome.extension.getBackgroundPage()を使えば元ページのwindowは取れる。とはいえ、元ページ上のスクリプト関数を利用したり、置換したりするような拡張は書きづらいかも。

*2:そもそもGreasemonkeyだって、面倒だからhttp://userscripts.org/とかにも登録したことないしなぁ