Javascript 无法在Chrome扩展中创建通知。接收未捕获类型错误：无法读取属性'；创建'；未定义错误的定义

当收到HTTP响应时，我试图在我的Chrome扩展中显示通知。每次我尝试时，都会出现以下错误

未捕获的TypeError:无法读取未定义的属性“create”

我已确保在manifest.json中设置了通知权限

我想我可能可以在回调函数中执行通知，但是我为回调传递的任何内容（函数、常量、变量等）都是未定义的

这是我的相关代码

function push(info,tab) {
   function modifyDOM(tab_info, callback) {
    var endpoint = "https://blahblahblah";
    var xmlhttp = new XMLHttpRequest();

    alert(callback); //always undefined. 
  
    xmlhttp.onreadystatechange = function() {
      if (this.readyState == 4) {
          if (this.status == 200) { 
            alert(this.responseText); 

             var msg = 'Pushed ' + tab_info.tab.url + ' to endpoint'; 
             var opt = {
                 iconUrl: "images/img48.png",
                 type: 'basic',
                 title: 'Handler',
                 message: msg
               };
               chrome.notifications.create(opt); //Error occurs here. 
          }
          else { 
            alert(callback); //always undefined 
          }
      }
    };
  
    xmlhttp.open("POST", endpoint);
    xmlhttp.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
    xmlhttp.send(JSON.stringify({ "body": {"content": document.body.innerText }, "query": { "url": tab_info.tab.url, "title": tab_info.tab.title} }));
}

chrome.tabs.executeScript({
    code: '(' + modifyDOM + ')(' + JSON.stringify({ "tab" : tab, "callback": 1}) +');' //callback parameter is always undefined in the modifyDOM() function above 
}, (results) => {
    console.log(results[0]);
  });
}

manifest.json

{
 "manifest_version": 2,    
 "version": "1.0",               
 "name": "Handler",   
 "description": "Push to endpoint",
  "icons": {
    "16": "images/img16.png",
    "48": "images/img48.png",
    "128": "images/img128.png"
   },
"permissions": [
    "tabs",
    "contextMenus",
    "*://*/*",
    "notifications"
],
 "background": { 
   "scripts": ["script.js"]
   }
  }

问题1

---

函数

modifyDOM

不会在后台脚本中运行。它只是在那里声明的，您可以将其代码转换为字符串，并通过chrome.tabs.executeScript进行注入，chrome.tabs.executeScript在活动选项卡中作为内容脚本运行代码。内容脚本不能使用大部分的

chrome

API，它们只能使用一些基本的API，如chrome.i18n、chrome.runtime、chrome.storage

解决方案是在后台脚本上下文中调用chrome.notifications，例如从注入的代码发送消息

问题2 参数作为单个对象传递

{“tab”：tab，“callback”：1}

，但函数声明为接受两个参数

最简单的解决方案是将函数声明为也接受单个对象，并使用解构

结果

函数modifyDOM（{tab，callback}）{
// ..............
xmlhttp.onload=函数（）{
如果（this.status==200）{
chrome.runtime.sendMessage（'Pushed'+tab_info.tab.url+'to endpoint'）；
}
};
// ..............
}

背景脚本全局代码：

chrome.runtime.onMessage.addListener（（消息、发送方、发送响应）=>{
变量opt={
iconUrl:'images/img48.png'，
类型：“基本”，
标题：“处理程序”，
消息
};
chrome.notifications.create（opt）；
});

内容脚本无法使用大部分API，因此您必须在后台脚本中执行。@wOxxOm再次感谢您的响应。这是一个背景脚本。我将在问题中添加manifest.json。设置后台脚本和内容脚本之间的消息传递。然后从您的内容脚本发送一条消息，指示您的后台脚本显示通知。您是否可以尝试在script.js的顶部执行通知，以测试它是否确实存在works@GertjanBrouwer，您只是不知道扩展API是如何工作的。API函数chrome.tabs.executeScript将函数的代码作为字符串，并将其作为内容脚本注入。