web-dev-qa-db-ja.com

Chrome拡張コンテンツスクリプトは、ページが更新されるまで読み込まれません

私はChrome拡張コンテンツスクリプトをTrelloボードで実行したいのですが、今のところ、それだけが含まれています：

console.log("Hello, world!");

[マイボード]ページなどの内部リンクからTrelloボードページを開くと、コンテンツスクリプトが実行されません。ただし、ページを更新した後に実行されます。

私のマニフェストファイルに含まれるもの：

{
  "manifest_version": 2,

  "name": "Temp Ext",
  "version": "1.0",

  "content_scripts": [
    {
      "matches": ["*://trello.com/b/*"],
      "js":["contentscript.js"]
    }
  ]
}

ページが最初にロードされたときにスクリプトが実行されない理由を誰かが私に理解するのを助けることができますか？

編集：質問を修正しました。問題は、リンクではなく、内部リンクをたどった後にのみ発生しました。

javascriptgoogle-chrome-extensiontrello
26
Natalie Chouinard

問題は TrelloがHTML5のpushStateを使用する ページの遷移に使用されていたため、ボードが開かれた後にコンテンツスクリプトが常に実行されていなかったということです。

ソリューション

マニフェストの変更：

{
  "manifest_version": 2,

  "name": "Temp Ext",
  "version": "1.1",

  "content_scripts": [{
    "matches": ["*://trello.com/*"],
    "js":["contentscript.js"]
  }],

  "background": {
    "scripts": ["background.js"]
  },

  "permissions": [
    "*://trello.com/*", "tabs", "webNavigation"
  ]
}

バックグラウンドスクリプトを追加：

chrome.webNavigation.onHistoryStateUpdated.addListener(function(details) {
    chrome.tabs.executeScript(null,{file:"contentscript.js"});
});
43
Natalie Chouinard