如何将nodelist对象传递给后台脚本？ [英] How to pass nodelist object to background script?

问题描述

我想从reddit获取所有标题，并将其传递到 backgroundScript.js 。

它显示控制台中的所有URL该页面，但由于某种原因，它显示了我的背景页面上的消息：

我的代码：
$ b manifest.json ：

  {
manifest_version：2，
 
name：Testing stuff，
 
description：此扩展名用于测试目的，
 
version：1.0，
 
background：{
scripts ：[backgroundScript.js] 
}，
 
content_scripts：[{
exclude_matches：[*：//*.reddit.com/r/ * / comments / *]，
js：[contentScript.js]，
matches：[*：//*.reddit.com/r/*， *：//*.reddit.com/，*：//*.reddit.com/me/m/*， *：//*.reddit.com/user/*/ m / *]，
run_at：document_end
}]，
permissions：[history ，tabs，http：// * / *] 
 
} 
  

contentScript.js ：

  titleUrls = document.querySelectorAll（a.title ）; 
 
 for（i = 0; i  var u = i + 1 
 console.log（u ++ titleUrls [i ] .href）; 
} 
 
 chrome.runtime.sendMessage（titleUrls）
  

backgroundScript.js ：

  chrome.runtime.onMessage.addListener（
 function（response ，sender，sendResponse）{
 var data = response; 
 
 alert（in backgroundScript.js，received+ data [1] .href）; 
} 
）; 
  

为什么在背景上显示 undefined 当它在主页面的控制台中显示所有的URL时就可以了？我在做什么错了？

您无法在 runtime.sendMessage（） message

runtime.sendMessage（）中的消息必须是一个JSON对象。 DOM元素/节点不是JSON可以的。因此，您无法发送它们。

您需要做的事情不是尝试序列化DOM元素，最终取决于您为什么需要这些信息后台脚本。

你已经声明你需要的信息是来自 .href 属性的URL。您可以构建这些网址的数组并发送：

contentScript.js ：

  titleUrls = document.querySelectorAll（a.title）; 
 var urlList = []; 
 for（i = 0; i  var u = i + 1 
 console.log（u ++ titleUrls [i] .href） ; 
 urlList.push（titleUrls [i] .href）; 
} 
 
 chrome.runtime.sendMessage（urlList）; 
  

backgroundScript.js ：

  chrome.runtime.onMessage.addListener（function（response，sender，sendResponse）{
 var urlList = response; 
 alert（in backgroundScript.js，received+ urlList [0]）; 
}）; 
  

I want to get all titles from reddit, and pass it to backgroundScript.js.

It shows all URLs in the console of the page but for some reason it shows me this message on background page:

My code:

manifest.json:

    {
  "manifest_version": 2,

  "name": "Testing stuff",

  "description": "This extension is for testing purposes",

  "version": "1.0",

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

  "content_scripts": [ {
      "exclude_matches": [ "*://*.reddit.com/r/*/ comments /*" ],
      "js": [ "contentScript.js" ],
      "matches": [ "*://*.reddit.com/r/*", "*://*.reddit.com/", "*://*.reddit.com/me/m/*", "*://*.reddit.com/user/*/ m /*" ],
      "run_at": "document_end"
    }  ],
    "permissions": [ "history", "tabs", "http://*/ *" ]

}

contentScript.js:

titleUrls = document.querySelectorAll("a.title");

for (i = 0; i < titleUrlsArray.length; i++) {
    var u = i + 1
    console.log(u + " " + titleUrls[i].href);
}

chrome.runtime.sendMessage(titleUrls)

backgroundScript.js:

chrome.runtime.onMessage.addListener(
    function (response, sender, sendResponse) {
        var data = response;

        alert("in backgroundScript.js, received " + data[1].href);
    }
);

Why does it show undefined on the background page when it shows all URLs just fine in the console of the main page? What am I doing wrong?

解决方案

You can't send DOM elements in a runtime.sendMessage() message

The message in runtime.sendMessage() must be "a JSON-ifiable object". DOM elements/nodes are not JSON-ifiable. Thus, you can not send them.

What you will need to do instead of trying to serialize the DOM element is, ultimately, determined by why you need this information in your background script.

You have stated that the information you need is the URLs from the .href property. You could build an array of those URLs and send that:

contentScript.js:

titleUrls = document.querySelectorAll("a.title");
var urlList=[];
for (i = 0; i < titleUrlsArray.length; i++) {
    var u = i + 1
    console.log(u + " " + titleUrls[i].href);
    urlList.push(titleUrls[i].href);
}

chrome.runtime.sendMessage(urlList);

backgroundScript.js:

chrome.runtime.onMessage.addListener(function(response, sender, sendResponse) {
    var urlList = response;
    alert("in backgroundScript.js, received " + urlList[0]);
});

这篇关于如何将nodelist对象传递给后台脚本？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！