「Tampermonkey」のマニュアル

「Tampermonkey」についての詳細なマニュアルは英語で以下のページにあります。 使用方法の疑問については、私が未熟で頻出しているのですが、ブラウザの翻訳機能で比較的判り易く翻訳できるので、時々見に行く事になりそうです。

 

     Tampermonkey documentation

 

ページは下の様なもので、ここにはユーザースクリプトのヘッダー部分に書き込める「@match」などのパラメーターについての説明と、GM関連のAPIなどについて書かれています。

 

 

ここには雛形で書き込まれない「@パラメーター」の記述があり、その幾つかは気になるものです。 今回は、これについて判った事を少し。

 

 

@noframes  (iframe内の実行を抑止)

これは「iframe」を含むページにスクリプトを適用した場合に、トップページでは実行するが「iframe」内では実行しないという指定です。 

 

先日作ったスクリプト「Edit At Once」   をテストしていると、妙な事に気付きました。 このスクリプトは自ブログのページで実行されるもので、その実行によって開いた編集画面は、実行されない以下の適用指定になっています。

 

// @match        https://ameblo.jp/personwritep*

 

ところが編集画面上の「Tampermonkey」アイコンは、下の様に赤い「1」が表示され「このスクリプトは1回実行されました」と表示されます。

 

 

これは、「Edit At Once」が実行されるはずがない管理画面から編集画面を開いても同様で、実害は無いがまるで適用先を無視している様です。 で調べると、編集画面には「iframe」があり、これは別のウインドウを開く様な仕組みで、この「iframe」に対してスクリプトが実行されてしまう事が判りました。

 

これを回避するには、スクリプト編集画面の横の「設定」タブを押して、スクリプトコードの「設定」画面を開き、下の部分を指定する事で解決できました。

 

 

「最上位フレーム(top)のみで実行する」の項目は最初は「既定」になっています。 これを「はい」に変更すれば、「iframe」内での実行がなくなりました。 これで判る事は、「既定」は「iframe」内でも実行される(いいえ)という事です。

 

「はい」を設定すると、「Tampermonkey」が内部的に「@noframes」を設定するのでしょう。

 

今度は、スクリプトヘッダーに「@noframes」を記入した場合はどうなるかを試しました。 以下のパラメーターを追記したわけです。

 

// @noframes

 

この記述がある場合、「設定」画面が「既定」の場合は、ヘッダーの指定が優先されます。 しかし「設定」画面が「いいえ」の場合、その指定の方が優先され「iframe」内でスクリプトが実行されました。

 

どうやら、ヘッダーの「@パラメーター」は「既定」の場合は優先されるが、それ以外は「設定」画面の指定が優先となる様です。

 

これは、他の「@パラメーター」にもおそらく当てはまりそうです。「公開されたスクリプト」を「編集画面」に置き、「Tampermonkey」のユーザーは「設定」画面で元のスクリプトの設定を更に変更上書きして利用する使い方の様です。

 

もっとも、これは使い方次第と思います。 特に自作スクリプトの場合は「編集画面」のヘッダーで明示的に指定出来るものは、なるべくヘッダーで全てしておくのが良さそうに思います。「@include」「@exclude」等も、どちらでも設定出来ますが、私はヘッダー側で記述しようと考えています。

 

 

@run-at  (スクリプト実行のタイミング)

これは、しばしば問題になるパラメーターです。 以下は引用。

 

スクリプトが挿入される瞬間を定義します。 他のスクリプトハンドラとは反対に、 @ run-atはスクリプトが実行したい最初の瞬間を定義します。 これは、 @ requestタグを使用するスクリプトがドキュメントがすでにロードされた後に実行される可能性があることを意味し、必要なスクリプトの取得に時間がかかる原因となります。 とにかく、与えられた注入の瞬間の後に起こったすべてのDOMNodeInsertedとDOMContentLoadedイベントはキャッシュされ、注入されたときにスクリプトに配信されます。

 

// @run-at document-start

 

スクリプトはできるだけ早く注入されます。 

 

// @run-at document-body

 

body要素が存在する場合は、スクリプトが挿入されます。

 

// @run-at document-end

 

スクリプトは、DOMContentLoadedイベントが送出されたときに送出されます。

 

// @run-at document-idle

 

DOMContentLoadedイベントが送出された後にスクリプトが挿入されます。 @ run-atタグが指定されていない場合、これがデフォルト値です。

 

// @run-at context-menu

 

スクリプトは、ブラウザのコンテキストメニューでクリックされた場合に挿入されます。(デスクトップChromeベースのブラウザのみ)

注:この値を使用すると、すべての@includeステートメントと@excludeステートメントは無視されますが、今後変更される可能性があります。

 

不明の問題

以上の説明の通りだと、「Tampermonkey」の導入とテスト  で作ったコードは、「window.onload = function() { };」の形にする必要は無いはずです。

 

しかし「// @run-at document-idle」をヘッダーに記述しても、あるいは「設定」で「実行のタイミング / document-idle」を指定しても、全くコードが正常に働きません。 結局、コード上で「window.onload」を書く事が必要なのです。

 

現在、これはアメブロ側のスクリプトの干渉を疑っています。「Tampermonkey」をOFFにしていても、ページを開くと DevTools上でスクリプトエラーが常に報告されますから。

 

〔追記〕 2019.06.18

複数のスクリプトが「window.onload」の書式で起動する指定になっていると、最後に読み込まれたスクリプトだけが起動します。 従って「Tampermonkey」に複数のスクリプトを登録して運用する場合、この書式を使っているとどれかのスクリプトが起動しない問題が生じる確率がとても高くなります。

これを避けるには「window.addEventListener( 'load', function() 」の書式が最も有効です。 現在、「window.onload」を使う事がなくなりました。

 

 

@match (適用)   @include (含める)   @exclude (除外)

@include とほぼ同じです。 ここ でより多くの情報を得ることができます 。

注:「<all_urls>」は未サポートで、スキーム部分も「http *://」の記述が可能。

 

「// @include」「// @match」「// @exclude」行は、行をわけて複数の記述ができます。 これらのヘッダーの記述内容は、「設定」画面で「元の include」「元の match」「元の exclude」の枠に表示されます。「Tampermonkey」は「編集画面」が「公開された元」であり、個別ユーザーの変更を「設定」画面で行うという建前です。 自作の場合は「設定」画面はテストの仮設定とし、最終的にはヘッダーに直接記入が良いと思います。