アンケートご協力のお願いgihyo.jpでは,2010年度に向けて豪華プレゼントが当たる読者属性アンケートを実施しております。ご協力ください。

gihyo.jp » DEVELOPER STAGE » 連載 » 続・先取り! Google Chrome Extensions » 第2回 User ScriptsとContent Scripts

続・先取り! Google Chrome Extensions

第2回 User ScriptsとContent Scripts

こんにちは,株式会社ALBERTの太田です。今回はGoogle ChromeのUser ScriptsとContent Scriptsについて,その仕様とGreasemonkeyとの違いを中心に,実際のスクリプトの書き方を交えて解説します。

ユーザースクリプトとは

User Scriptsとは,Google Chrome版のGreasemonkey(ただし,後述の通り互換性はあまり高くありません)です。そもそもGreasemonkeyとは任意のページで任意のJavaScriptを実行し,そのページに機能を追加したり,(自分にとって)不要なものを取り除いたり,異なるサービスとの連携をしたり,といったことをJavaScriptファイルひとつで実現できるようにするFirefoxのAdd-onです。その手軽さと,それに見合わぬ強力なカスタマイズ性能から高い人気を得ています。

しかし,Greasemonkeyはその手軽さと引き換えに安全性を犠牲にしている面があります。AMO(addons.mozilla.org)に公開されているMozillaアプリケーション用のAdd-onはAMO(のレビュアー)による品質管理が行われていますが,userscripts.orgに公開されているGreasemonkey用Scriptはそういったチェックを受けていません。このため使用には十分に注意する必要があります(当然ながら,Add-onについてもAMO以外で公開されているのであれば,より注意が必要です)。これはChromeのUser Scriptsについても同様です(と,少々脅し気味に書きましたが,実際のところ私自身は悪意あるユーザースクリプトというものを見たことはない,ということを申し添えておきます)。

ChromeのUser ScriptsとGreasemonkeyのほかにも,SafariのプラグインのGreaseKitやOperaの標準機能のUserJavaScript,Internet Explorerのコンポーネントブラウザの一部にも同様の機能が実装されています。これらを総称して,ユーザーサイドスクリプトと呼ぶこともあります。

導入

まずは,ChromeのUser Scriptsの動作環境について説明します。ChromeのUser ScriptsはGoogle Chrome 2以降のバージョンで動作します。なお,Chrome 2以前はGreasemetalというプラグインが利用できましたが,Chrome側がネイティブサポートしたためGreasemetalの開発は終了しています。

ChromeのUser Scriptsは起動オプションで --enable-user-scripts というオプションを付けることで使用可能になります。Windows XP, Windows Vistaでのパスは以下の通りです。[username] の部分にはログインしているユーザー名が入ります。

"C:\Documents and Settings\[username]\Local Settings\Application Data\Google\Chrome\Application\chrome.exe" --enable-user-scripts
"C:\Users\[username]\AppData\Local\Google\Chrome\Application\chrome.exe" --enable-user-scripts

オプションを付けて起動すると,ユーザーデータフォルダにUser Scriptsという名前のフォルダが作られます(あらかじめ自分で作成しても問題ありません)。

Windowsの場合,ユーザーデータフォルダは下記の場所になります。一部が隠しフォルダになっているため,探しにくい点に注意してください。

Windows XP

C:\Documents and Settings\[username]\Local Settings\Application Data\Google\Chrome\User Data\Default\

Windows Vista

C:\Users\[username]\AppData\Local\Google\Chrome\User Data\Default\

このUser Scriptsフォルダにファイル名が .user.js で終わるスクリプトを置けば,自動でファイルを認識して,@include(もしくは@match)で指定されたページを開いた際にそのスクリプトが実行されます。再起動などは必要なく,ファイルを更新した際も次の読み込み時に即座に反映されます。

User Scriptsの仕様

Greasemonkeyを意識して実装されていますので,動作面ではGreasemonkeyとの互換性があります。

  • スクリプトの実行タイミングはGreasemonkeyと同じく,DOMContentLoaded(DOMの構築後,画像などの読み込み完了前)で起動します。

  • スクリプトの実行コンテキストがサイト側のスクリプトと分かれています。このため意図せずにグローバル変数を使用してしまったり,サイト側のスクリプトの処理を上書きしてしまうようなことはありません。

ただし,機能面ではGreasemonkeyと異なる部分が多くあります。

  • @exclude, @require, @resourceなどのメタデータを使用できません。

  • unsafeWindowに相当するサイト側のグローバルオブジェクトがありません(Chrome 2ではcontentWindowという名前でサイト側のグローバルオブジェクトにアクセスできましたが,Chrome 3以降では廃止されています)。

  • サイト側のコンテキストでJavaScriptを実行したい場合,ブックマークレット(location.hrefにjavascriptスキームを代入するなどの方法で実現できます)として実行するか,script要素を作ってコードをテキストノードとして挿入する必要があります。

  • GM_setValue, GM_getValueなどのGM APIもほとんど使用できません。Chrome 2では名前だけ定義だけされていて,実際には使用できない状態で非常に厄介なことになっていましたが,Chrome 3, 4では定義されていない状態に修正されました。

  • GM APIで使用可能なのはGM_addStyle,GM_xmlhttpRequest(ただし,ドメインを超えることはできません),GM_openInTab(実装はwindow.openのラッパー),GM_log(やはりconsole.logのラッパー)の4つです。

また,Chrome UserScript独自の機能もあります。

@matchメタデータ

@matchは@includeの改良版という位置づけで,@includeよりも正確なパターン指定が可能です。@matchはhttpなどのschemeパート,google.comなどのhostパート,/search?などのpathパートに分けてマッチングが行われます。@includeでは http://*.google.com/* というパターンが,http://another.site.com/?.google.com/ にもマッチしてしまうという問題がありますが,こういった問題は@matchでは起こりません。

@includeとは書式が異なる部分が多いので,詳細はMatch patternsを参照してください。特に,Bad patternはやってしまいがちなパターンがまとめられています。

@run-atメタデータ

@run-atはdocument-startと指定することで,ページのDOM構築を待たずに,読み込みを開始したタイミングでスクリプトを実行します。実行タイミングが速いので,例えばショートカットキーなどをこのタイミングで登録すればユーザーの待ちを軽減することができます。ただし,当然ながらDOM要素にアクセスできないため,出来ることは大幅に制限されます。

Content Scriptでも同様のことが可能ですが,run_atとdocument_startという組み合わせであり,ハイフンではなくアンダースコアという違いがあるので注意が必要です。

これらの点に注意すれば,Greasemonkey用のスクリプトをUser Scriptsで動かすことはそれほど難しくありませんが,残念ながらChromeとの互換性を意識して書いていないGreasemonkey ScriptがChromeで動くことは滅多にありません。ただ,OperaやSafariをサポートするスクリプトはChromeでも動作する可能性が高くなります。実際,Greased LightboxはChromeでも動作します。

著者プロフィール

太田昌吾(おおたしょうご,ハンドルネーム:os0x)

1983年生まれ。JavaScriptをメインに,HTML/CSSにFlashなどのクライアントサイドを得意とするウェブエンジニア。2009年12月より、Google Chrome ExtensionsのAPI Expertとして活動を開始。

URLhttp://d.hatena.ne.jp/os0x/

コメント

コメントの記入

パスサポ

多数の情報処理技術者試験対策書籍の発行実績を誇る技術評論社がお届けする,資格試験合格サイト「めざせ! 情報処理試験 パスサポ」が開設されました。

ピックアップ

サクセスストーリーに続く,快適サーバー運用管理のヒント!

データの増大,煩雑な管理,システムダウン,セキュリティなど,迫りくる課題からシステム管理者の負担を軽くするポイントを解説します。

gihyo.jp インフラエンジニア情報局

ネットワークやITにかかわるあらゆる業種で必要とされるインフラエンジニアに向けた技術情報や心構え,その魅力について多角的に紹介。

テストエンジニア ステーション

いま,ITに関わるあらゆる開発業務で注目されつつあるテスト系エンジニアをターゲットにしたコンテンツサイトを展開します。

一行クイックアンケート

gihyo.jpで取り上げてほしいネタは?

※検索はページ右上の検索ボックスをご利用ください。

その他の連載

キーパーソンが見るWeb業界

本連載はWeb Site Expert/gihyo.jpとの連動企画です。阿部淳也, 長谷川敦士, 森田雄のお三方による,Web業界をテーマにした座談会です。

きたみりゅうじの聞かせて珍プレー

ソフトウェア開発の現場で体験したトホホな失敗,思わずうなる珍プレーをきたみりゅうじ氏が四コママンガで紹介。みなさんからの投稿もお待ちしてます!

ActionScript 3.0で始めるオブジェクト指向スクリプティング

野中文雄氏が,簡単なスクリプトは書いたことがあるという初級者を対象に,ActionScript 3.0の基本からクラス定義までを解説します。

まだ間に合う「ITパスポート」受験対策 原山先生の短期合格塾

この連載では,4月18日のITパスポート試験の受験に向けて,短い期間で効率良く受験対策を行う方法や,確実に得点するための裏ワザなどを伝授していきます。

Ubuntu Weekly Recipe

Ubuntuの強力なデスクトップ機能を活用するための,いろいろなレシピをお届けします。

C/C++プログラマのためのDTrace入門

よくカーネルのチューニングや解析で活用されるDTraceですが,実はユーザプログラムの開発においても非常に有用です。連載ではC/C++プログラマやテストに関わる方向けにDTraceの使い方を解説します。

Blogopolisから学ぶ計算幾何

計算幾何学は,図形に関するアルゴリズムを研究するコンピュータサイエンスの一分野です。本連載では,ビジュアルブログ検索エンジン「Blogopolis」で採用されている計算幾何のアプローチを例に取り上げながら,計算幾何の初歩を実践的に学習します。

検索エンジンはいかにして動くのか?

本連載では, 今や誰もが利用している検索エンジンの中身を,全体の仕組みやデータ構造,アルゴリズムから分散インデックスまで,最近の研究事例も交えて紹介します。

連載一覧

gihyo.jp

  • DEVELOPER STAGE
  • ADMINISTRATOR STAGE
  • WEB+DESIGN STAGE
  • LIFESTYLE STAGE
  • SCIENCE STAGE
  • NEWS & REPORT

書籍案内

  • 新刊書籍
  • 書籍ジャンル一覧
  • 書籍シリーズ一覧
  • 新刊ピックアップ
  • ロングセラー
  • 電脳会議

定期刊行物一覧

  • Software Design
  • WEB+DB PRESS
  • Web Site Expert
  • 組込みプレス