このブログのはてなブックマーク数 このエントリーをはてなブックマークに追加

知らなきゃ絶対損するPCマル秘ワザ

知らなくて損したPC情報とかを分かりやすくメモする個人ブログ。
『月,水,金』の週3回更新!(予定)

このブログ内をキーワードで検索することもできます。
Loading



最新記事
  • Windows: PCの「IPアドレス」「MACアドレス」を確認する方法 (07/16)
  • LINEモバイル:ソフトバンク回線に変更してみた (07/13)
  • JavaScript:正規表現のメソッドがややこしい! 違いを学ぶ (07/11)
  • Firefox:ダイアログなしでリンク先を保存する(Alt + クリック) (07/09)
  • ツイッター:「不適切な内容が含まれている」は自分だけで直せる (07/06)
  • 管理人より
    2300万アクセス突破しました。ありがとうございます。

    ユーザースクリプトが2回実行されてしまう時の解決方法

    このエントリーをはてなブックマークに追加
    操作画面


    こんにちは、さち です。

    先日、Firefox のアドオン「Tampermonkey」で
    とあるサイト用のユーザースクリプトを書いていました。

    動作テストをすると
    なぜか、ユーザースクリプトが2回実行される問題が発生。

    今回は、この現象の解決方法について書いていきます。




    ユーザースクリプトが2回実行される

    1. テスト用のユーザースクリプトを作りました。
      ユーザースクリプトが実行されるとコンソールにログが表示されます。
      // ==UserScript==
      // @name Test Userscript
      // @namespace http://tampermonkey.net/
      // @version 0.1
      // @description test
      // @author uminosachi
      // @match http://example.com/
      // @grant none
      // ==/UserScript==

      (function() {
      console.log('ユーザースクリプト 実行');
      })();

    2. Firefox の「コンソール(Ctrl + Shift + K)」で確認してみると
      ユーザースクリプトが2回も実行されています
      操作画面

    同じユーザースクリプトでも
    Greasemonkey で動かすと1回しか実行されませんでした。
    Tampermonkey とは挙動が異なるようです。




    解決方法

    原因は、「iframe」内でもユーザースクリプトが実行されるためでした。
    スクリプトにおまじないを書いてフレームを無視するようにしましょう。

    1. 9行目のように「==UserScript==」内に「@noframes」を追記します。
      // ==UserScript==
      // @name Test Userscript
      // @namespace http://tampermonkey.net/
      // @version 0.1
      // @description test
      // @author uminosachi
      // @match http://example.com/
      // @grant none
      // @noframes
      // ==/UserScript==

      (function() {
      console.log('ユーザースクリプト 実行');
      })();

    2. これで、ユーザースクリプトの実行は1回だけになります。
      操作画面

    ちなみに、Tampermonkey の場合
    問題が発生しているユーザースクリプトのエディター画面から「設定」タブを開き
    「最上位フレーム(top)のみで実行する」を「はい」にしても同じ効果が得られます。
    操作画面

    当然、「最上位フレーム(top)のみで実行する」は
    自分のブラウザでのみ有効な設定です。
    配布する予定があるものは、スクリプト内に「@noframes」を記述しましょう。

    多くのユーザースクリプトはフレーム内での実行を想定していないと思うので
    Tampermonkey のテンプレートに追記しておいても良いかもしれません。




    余談 - 自力実装してみる

    前述のような用意されているものを使わないで
    JavaScript だけで自力実装する場合はこうなります。
    // ==UserScript==
    // @name Test Userscript
    // @namespace http://tampermonkey.net/
    // @version 0.1
    // @description test
    // @author uminosachi
    // @match http://example.com/
    // @grant none
    // ==/UserScript==

    (function() {
    if(top !== self) return false;
    console.log('ユーザースクリプト 実行');
    })();

    「top」は window.top の省略記述で、トップフレームの URL
    「self」は window.self の省略記述で、現在のフレームの URL です。
    両者が一致しない時は、フレーム内での実行なのでスクリプトを終了します。
    これで、スクリプトの実行は(トップフレームでの)1回だけになります。

    原理的には
    自分のサイトがフレームで他サイトに読み込まれるのを防ぐ方法と同じですね。









    このエントリーをはてなブックマークに追加




    管理人だけが読めるコメントにする(返信はしません)
    【お知らせ】
    • コメントは承認制です。反映に時間がかかります。
    • Yahoo!BBはスパムコメントが多いため一部規制中です。
    • URLを含む投稿はできません。必要な場合は最初のhを削って下さい。
    • 記事に直接関係ない個人のトラブルにはお答えできません。
    • Android は使ったことがないので質問を頂いても答えられません。
    • その他詳細はこちら





    記事別の週間アクセス数ランキングです。こちらの記事もぜひ読んでみて下さい。

    2008-2018 知らなきゃ絶対損するPCマル秘ワザ  無断転載禁止

    ブログパーツ