将 chrome.runtime.onemessage 与 Jquery ajax 一起使用时出错

Question

之前我有代码：

 $.get(url, function(data){
        var $response = $(data);
        overallRating = $response.find("div.grade").eq(0).html();
        arr[pos].rating = overallRating;

为了得到我要找的数据。这在大多数情况下都有效，但我无法将值分配给 arr[pos]。我发现因为 $.get() 是异步的，所以我可以使用 chrome.runtime.onMesssage 和 .sendMessage 并使用回调函数来访问值。所以我在后台脚本中想出了这个，tabcheck.js:

chrome.runtime.onMessage.addListener(function(message, send, callback){ 
console.log("message recieved");
$.get(send.url , function(data){                                            
            console.log(data);
            callback(data);                                 
    });

return true; //


});

以及我的 popup.js 页面中的发送消息：

chrome.runtime.sendMessage('message', {url: url } , function(data) {
            console.log(data);
            var $response = $(data);
            overallRating = $response.find("div.grade").eq(0).html();
            arr[pos].rating = overallRating;
    });

而且我认为正在发生的事情是在 onmessage 中 url 没有被访问。我记得收到类似于 Chrome Extention Port error: Could not establish connection. Receiving end does not exist 的错误，但不记得那是否是确切的错误。数据返回未定义

那么第一个和第二个之间发生了什么变化，使得新函数无法再访问 url？我该如何解决？我的目标是将 overAllRating 的值放入 arr[pos].rating。

如果需要的话，这是我的清单：

{
 "manifest_version": 2,

  "name": "",
  "description": "n",
 "version": "1.0",

"background":{
    "scripts": ["jquery-2.1.3.min.js","tabcheck.js"],
    "persistent": false
},
"permissions":[
    "tabs",
    "https://www.myurl1/*",
    "http://www.myurl2/*",

     ],


 "browser_action": {

    "default_icon": "icon.png",
    "default_popup": "uv.html",
    "default_title": ""

 },

"content_scripts": [
    {
    "matches":["https://www.myurl/*"],
    "js":["jquery-2.1.3.min.js","main.js"]

    }

]


}

Answer 1

免责声明

此答案是关于修复代码中的错误，而不是逻辑中的错误。您的代码可以工作，但无论如何都不会按预期进行。见答案结尾。

修复消息代码

// Wrong:
chrome.runtime.sendMessage('message', {url: url} , function(data) {/*...*/});

这是 sendMessage 的错误格式。

您可以看到 full documentation，但通常需要 2 个参数：

chrome.runtime.sendMessage(message, callback);

其中 message 可以是任何东西 - 只要它是 JSON-可序列化的。

如果您添加一个字符串作为第一个参数，它将变成一个 3 参数形式，并被解释为一个交叉扩展消息，第一个参数是目标 ID。

Chrome 试图找到 ID 为 "message" 的扩展，但失败了，出现 "receiving end does not exist" 错误。

传递给监听器的消息如下：

chrome.runtime.onMessage.addListener(function(message, sender, sendResponse {
  // message is the original message
  // sender is an object containing info on who sent the message
  // sendResponse is a function to be called
});

您正在尝试使用 第二个 参数：

chrome.runtime.onMessage.addListener(function(message, send, callback){ 
  console.log("message recieved");
  $.get(
    send.url, // <-- This is wrong
    function(data) {                                            
      console.log(data);
      callback(data);                                 
    }
  );

  return true;
});

重新组合：

chrome.runtime.sendMessage(
  {url: url}, // This will be the message
  function(data) {/*...*/}
);

和

chrome.runtime.onMessage.addListener(function(message, sender, callback){ 
  console.log("message recieved");
  $.get(
    message.url,
    function(data) {                                            
      console.log(data);
      callback(data);                                 
    }
  );
  return true;
});

现在才是真正的问题

既然我们修复了这个错误，这对你没有任何帮助！

您没有 "cured" $.get 的异步特性。现在涉及 2 层异步性，AJAX 和消息传递。您的作业仍然无法按预期进行 - 并且没有足够的代码来解决这个问题。

您可能运行遇到以下两个问题之一：

Why is my variable unaltered after I modify it inside of a function?（如果您尝试在此代码后使用 arr）
JavaScript closure inside loops（如果你认为你的 pos 表现得很有趣）

我建议仔细研究这两个典型问题。你根本不需要在这里发消息，它不能解决任何问题。

将 chrome.runtime.onemessage 与 Jquery ajax 一起使用时出错

Error when using chrome.runtime.onemessage with Jquery ajax

ajax

jquery

google-chrome

google-chrome-extension

免责声明

修复消息代码

现在才是真正的问题