UserScriptの書き方メモ

はじめに

このページはUserScriptに関する「書き方」「作り方」のメモです。UserScriptのインストール方法等の「使い方」に関しては、「UserScriptのブラウザごとの違い」で説明しています。

私がUserScriptの勉強を始めた頃に、UserScriptに関する書き方・作り方に関しリファレンス等を探したのですが、サンプルはたくさん見つかるものの情報が体系的にまとめられているサイトは見つかりませんでした。このページでは(つたない内容ではありますが)、私が学んだことや調べたことの断片を寄せ集めてメモとして残しておきます。

UserScriptとは

UserScriptとは、利用者が訪問するウェブページに対し変更・操作を加えることを可能にする機能です。UserScriptを利用することで、機能追加やデザイン変更を自由に行ったり、よく行なう操作の自動化を行なうこと等ができます。基本的にはJavaScriptでできる範囲に限られますが、プラグインによってはプラグインで独自に用意している機能を利用できるケースもあります。

UserScriptを動かす為の仕組みは、ChromeとOperaではブラウザの標準機能として搭載されておりそのまま利用できます。FireFoxではGreasemonkeyというアドオンを、IEではie7proというアドオンを、SleipnirではSeaHorseというアドオンをインストールすることで使えるようになります。

(各ブラウザに共通する)基本的なルール

UserScriptの内容は、テキストファイルにJavaScriptで記述します。文字コードはUTF-8にする必要があります(SleipnirではSJISでないと文字化けします)。またファイル名の末尾を「.user.js」にしなければなりません(Operaの場合は「.js」、IE7Proの場合は「.ieuser.js」)。

UserScriptではメタデータを指定することにより、動作させるサイトを指定したり、スクリプト名・説明・バージョン等の情報を付加すること等ができます。メタデータを指定する場合には、UserScriptヘッダとして以下のように書きます。

// ==UserScript==
// メタデータ1
// メタデータ2
// …
// ==/UserScript==

ただし、以下のようなブラウザによって対応が異なる点があります。

UserScriptヘッダ自体が省略可のブラウザと不可のブラウザがある
記述しても無視される(対応していない)メタデータがある

※ブラウザごとの違いについては、「UserScriptのブラウザごとの違い」を参照してください。

メタデータには、以下のものがあります。メタデータの記述順は特に決まりはありません。

メタデータ

メタデータ名	内容
@name	スクリプト名
@namespace	名前空間(※)。URLか tag:URIs を指定します。URLとしては存在しないサイトを含め何を指定しても問題ないのですが、一般的には作成者のサイトのURLを指定します。また(公開用のサイトを持っていないためのなのか)実行先のサイトを指定しているケースもよく見かけます。
@version	スクリプトのバージョン。Chrome/Greasemonkeyのみ。主に表示用。
@description	スクリプトの説明。表示用。
@include	スクリプトを実行するURI。ワイルドカードとして「*」が使えます。複数行記述可能です。
@exclude	スクリプトを実行しないURI。ワイルドカードとして「*」が使えます。複数行記述可能です。
@require	参照するJavaScriptライブラリ。Greasemonkeyのみ

(※)名前空間（なまえくうかん）はNamespaceの訳語で、名前の集合を分割することで衝突の可能性を低減しつつ参照を容易にする概念である。名前空間 - Wikipedia

サンプル

UserScriptの書き方の例を示します。これをファイル名「hello.user.js」、文字コードをUTF-8で保存しインストールしてみてください。「Hello World !」を表示するだけのサンプルです。「http://www.m-bsys.com/」内の「code」以外のページを開いた場合にのみ動作します。

// ==UserScript==
// @name        Hello World !
// @namespace   http://www.m-bsys.com/
// @description 「Hello World !」を表示するだけのサンプルです。「http://www.m-bsys.com/」の「code」以外のページを開いた場合にのみ動作します。
// @include     http://www.m-bsys.com/*
// @exclude     http://www.m-bsys.com/code/*
// ==/UserScript==

alert("Hello world!");

スクリプトの汎用性についての私見

requireは便利ですが、現在のところ残念ながらFireFox＋Greasemonkeyでしか使えません。ですので使用はお勧めできません。またGreasemonkeyだけで使える関数として、GM_setValue/GM_getValueやGM_xmlhttpRequestなどが用意されていますが、こちらもお勧めできません。これらのメタデータ・関数をどうしても使用する場合には、FireFoxでしか動かないブラウザ依存スクリプトになることを理解した上で使用してください。

UserScriptはこれからもっと発展していく可能性のある技術です。IE / FireFox / Chromeの主要ブラウザはもちろん、それ以外のブラウザでも実行可能になってきています。特定のブラウザでしか使えない一部の機能を使いたいがために、他のブラウザでは動かないスクリプトにしてしまうのは、私はもったいない事だと思っています。

もちろん自分しか使わないツールならばそれでもいいかもしれません。しかし、もしも公開して人に使ってもらおうと思っているのであれば、より多くの人に使ってもらうためにも、多くのブラウザで使用できるスクリプトにすべきだと思います。

また、もしも特定のブラウザでしか動かないスクリプトにしてしまいそれを公開する場合には、使用する人が誤解しないよう特定のブラウザでしか動かない旨をスクリプトのdescriptionに明記すべきです。

2012/01/24

	このサイトを検索