使用内容脚本中的sendMessage到背景页面的Google Chrome扩展程序变量未定义

Question

我正在使用基本的Google Chrome扩展程序，并且在从localStorage获取值时遇到问题。我在内容脚本中使用sendMessage从后台页面请求变量。当我得到响应时，变量总是“未定义”，除非我在响应之后放了类似alert（）的东西......然后变量包含我的值。你能帮我弄清楚这是为什么以及如何正确地做到这一点？我已经为这篇文章制作了代码，它在下面。非常感谢你！

---

的manifest.json

{
  "name": "Test Extension",
  "version": "1.0",
  "manifest_version": 2,
  "description": "A test extension.",
  "background": {
    "scripts": ["background.js"]
  },
  "content_scripts": [
    {
      "matches": ["<all_urls>"],
      "js": ["content.js"]
    }
  ],
 "permissions": [
    "tabs", "<all_urls>"
  ]
}

---

content.js

alert('content');

var color;

chrome.extension.sendMessage({greeting:"color"},function(response){color = response.farewell;});

// alert('pause'); // uncommenting this line lets me get the value...why?

alert('content - ' + color);

---

background.js

alert('background');

localStorage["color"] = "lightblue";

var color = localStorage["color"];

alert('background - ' + color);

chrome.extension.onMessage.addListener(function(request,sender,sendResponse)
{

if (request.greeting == "color") {sendResponse({farewell:color});}

});

---

非常感谢您的帮助！ ：）

Answer 1

因为响应在回调函数中。如果你有这个：

chrome.extension.sendMessage({greeting:"color"},function(response){color = response.farewell;});

alert('content - ' + color);

浏览器执行sendMessage，然后IMMEDIATELY进入下一行，即警报。 sendMessage中的回调在之后被激活。警报“修复”它，因为您基本上暂停了浏览器。如果要将color用作变量，则只能在callback：function（response）中使用它。