Chrome拡張機能:URLの取得時に拡張機能のコンテキストが無効になりました

Aug 21 2020

Chrome拡張機能フォルダの1つからウェブサイトのDOMにいくつかの画像を取得していますが、拡張機能を再読み込みするたびに、「拡張機能のコンテキストが無効になっています」というエラーが発生します。'chrome.storage.local.set'を実行しても同じことが起こります。

調査を行ったところ、このエラーはこの回答で十分に説明されている事実に関係していることがわかりましたが、コンテンツスクリプトとbackground.jsの間でメッセージを送信していないため、なぜこれが発生するのでしょうか。

これは、エラーが発生するスクリプトの一部です(popup.jsのchrome.tabs.executeScriptを介して挿入されます)。基本的に、拡張フォルダーの1つからWebサイトDOMに画像を挿入しています。

  for (let k = 0; k < incomingChatTags.length; k++) {
    let normalHolderTag = $(incomingChatTags[k]).text().toLowerCase(); switch (normalHolderTag) { case "vip": $(incomingChatTags[k]).addClass("ce-vip");
        priorityVal += 300;
        break;
      case "rg":
        $(incomingChatTags[k]).addClass("ce-rg"); priorityVal += 240; break; case "accountclosure": $(incomingChatTags[k]).addClass("ce-accountclosure");
        priorityVal += 200;
        break;
      case "21com":
        let logo21 = chrome.extension.getURL("/images/21_thumb.png");
        $(incomingChatTags[k]).html('<img src="' + logo21 + '" />'); $(incomingChatTags[k]).addClass("ce-tag-logo");
        break;
      case "caxino":
        //the console shows the error here and not before....¿why? 
        let logoCaxino = chrome.extension.getURL(
          "/images/caxino_thumb.png"
        );
        $(incomingChatTags[k]).html('<img src="' + logoCaxino + '" />'); $(incomingChatTags[k]).addClass("ce-tag-logo");
        break;
      case "justspin":
        let logoJustSpin = chrome.extension.getURL(
          "/images/wildz_thumb.png"
        );
        $(incomingChatTags[k]).html('<img src="' + logoJustSpin + '" />'); $(incomingChatTags[k]).addClass("ce-tag-logo");
        break;
      case "neonvegas":
        let logoNeonVegas = chrome.extension.getURL(
          "/images/neonVegas_thumb.jpg"
        );
        $(incomingChatTags[k]).html('<img src="' + logoNeonVegas + '" />'); $(incomingChatTags[k]).addClass("ce-tag-logo");
        break;
      case "nitrocasino":
        let logoNitroCasino = chrome.extension.getURL(
          "/images/nitroCasino_thumb.jpg"
        );
        $(incomingChatTags[k]).html( '<img src="' + logoNitroCasino + '" />' ); $(incomingChatTags[k]).addClass("ce-tag-logo");
        break;
      case "snabbis":
        let logoSnabbis = chrome.extension.getURL(
          "/images/snabbis_thumb.png"
        );
        $(incomingChatTags[k]).html('<img src="' + logoSnabbis + '" />'); $(incomingChatTags[k]).addClass("ce-tag-logo");
        break;
      case "sb.bet":
        let logoSB = chrome.extension.getURL("/images/sb_thumb.png");
        $(incomingChatTags[k]).html('<img src="' + logoSB + '" />'); $(incomingChatTags[k]).addClass("ce-tag-logo");
        break;
      case "wildz":
        let logoWildz = chrome.extension.getURL("/images/wildz_thumb.png");
        $(incomingChatTags[k]).html('<img src="' + logoWildz + '" />'); $(incomingChatTags[k]).addClass("ce-tag-logo");
        break;
      case "wishmaker":
        let logoWishMaker = chrome.extension.getURL(
          "/images/wishmaker_thumb.png"
        );
        $(incomingChatTags[k]).html('<img src="' + logoWishMaker + '" />'); $(incomingChatTags[k]).addClass("ce-tag-logo");
        break;
    }
    $(incomingChat).attr("data-priority", priorityVal); $(incomingChat).find(".numbers_cell").text(priorityVal);
  }

回答

2 Lowtrux Sep 04 2020 at 09:49

これを維持するために私がしたことを説明したいと思います。

基本的に、このエラーを引き起こしていたすべてのものを次のようにラップします。

typeof chrome.app.isInstalled !== "undefined"”

正直なところ、私はまだこれが機能している理由を理解しようとしています。拡張機能を更新するたびに、コンテンツスクリプトが引き続きWebサイトに挿入されることを理解しています(私の場合、dom要素の取得、Chromeローカルストレージへのデータの保存など)が、そのステートメントがこれを回避する理由がわかりません。拡張機能はまだブラウザにインストールされています。ファイルを更新しているだけです。

誰かがこれが私のために働いている理由のより詳細な説明を与えることができるならば、ここで光を当ててください。

1 Ghazi Oct 17 2020 at 22:09

拡張機能をリロードすると、古いコンテンツスクリプトは、更新するまで開いたページに残ります。ただし、Chrome拡張機能に関するコンテキストは失われます。

状況を回避するための1つのライナー:

if(chrome.runtime.id == undefined) return;