无法读取未定义的属性“ onBoundsChanged”

时间:2018-11-25 11:53:01

标签: google-chrome google-chrome-extension

当我为google chrome写扩展程序时,出现标题问题错误。下面是我的代码:

chrome.browserAction.onClicked.addListener(function (tab) {
chrome.tabs.executeScript(null, {
    file: "libs/jquery.js"
}, function () {
    chrome.tabs.executeScript(null, {
        file: "src/content.js"
    });
});
});

chrome.app.window.onBoundsChanged.addListener(function (tab) {
chrome.tabs.executeScript(null, {
    file: "libs/jquery.js"
}, function () {
    chrome.tabs.executeScript(null, {
        file: "src/content.js"
    });
});
});

首先,我在onClicked事件上获得了成功。但是当我调整窗口大小时,我想扩展工作。但是当我添加第二事件时。发生错误

请帮助我这个错误 谢谢

manifest.json

{
"name": "Bootstrap Grid for any Website",
"version": "1.1.0",
"manifest_version": 2,
"description": "Quickly toggle a Bootstrap Grid for any website. Easy to use, easy success.",
"browser_action": {
"default_icon": "src/icon48.png"
},
"background" : {
"scripts" : [
  "src/background.js"
]
},
"content_scripts": [
{
  "js":         [ "src/send_value.js" ],
  "matches":    [ "<all_urls>" ],
  "all_frames": true,
  "run_at":     "document_end"
}
],
"permissions": ["activeTab"]
}

2 个答案:

答案 0 :(得分:1)

我认为您混用了chrome扩展程序和chrome应用程序。如我们所见herechrome.app.window

  

未与任何Chrome浏览器窗口关联

我建议您创建content.js脚本,并在其中放置如下内容:

window.addEventListener('resize', function(e){
  ....
   // here you send message to background.js
   var message = { info: "window resized");
   chrome.runtime.sendMessage( "", message );
}) 

content.js必须在清单文件中指定的每个选项卡中执行。

在您的background.js中,您应该编写:

chrome.runtime.onMessage.addListener(function(message){
   if(message.info === "window resized"){
       chrome.tabs.executeScript(null, // ..... the stuff you've written above
      ......
   }
}); 

链接:

chrome.runtime.sendMessage

chrome.runtime.onMessage

祝你好运!

UPD(清单文件中):

      "background": { 
            "scripts": [ "background.js"]
        },
       "content_scripts": [
         {
           "js":         [ "content.js" ],
           "matches":    [ "<all_urls>" ],
           "all_frames": true,
           "run_at":     "document_end"
         }
      ],

UPD2。此摘录来自我正在使用的扩展清单:

"web_accessible_resources": [
    "main.js",
    "style.css",
    "options/options.css",
    "options/options.js"
  ]

答案 1 :(得分:0)

您的扩展程序文件夹如下:

Folder strucrure

您的manifest.json文件:

{
  "name": "Bootstrap Grid for any Website",
  "version": "1.1.0",
  "manifest_version": 2,
  "description": "Quickly toggle a Bootstrap Grid for any website. Easy to use, easy success.",
  "browser_action": {
    "default_icon": "src/icon48.png"
  },
  "background" : {
    "scripts" : [
      "background.js"
    ]
  },
  "permissions": [
    "tabs",
    "<all_urls>"
  ],

  "web_accessible_resources":[
    "src/content",
    "src/content_temp",
    "libs/jquery.js"
  ]

}

background.js

chrome.browserAction.onClicked.addListener(function (tab) {
    chrome.tabs.executeScript(null, {
        file: "libs/jquery.js"
    }, function () {
        chrome.tabs.executeScript(null, {
            file: "src/content.js"
        });
    });
});

chrome.runtime.onMessage.addListener(function(message){
    if(message.info !== 1) return;

    chrome.tabs.executeScript(null, {
            file: "src/content_temp.js"
    });
});

然后将您的send_value.js文件放入content.js

window.addEventListener('resize', function (e) {
    // here you send message to background.js
    var message = {info: 1}
    chrome.runtime.sendMessage("", message);
});


function devTool() {

至于我,它工作正常! :-)