google-chrome-extension - 在Chrome扩展程序开发中，如何将变量从background.js传递到作为脚本节点嵌入的内容脚本？

Question

更新:很抱歉我不清楚我的情况。内容脚本并不是字面上的内容脚本，而是通过 createElement 方法嵌入到页面中的 js 文件。

它是这样的:

// this is "content.js"
var scriptElement = document.createElement('script');
scriptElement.src = 'chrome-extension://' + chrome.runtime.id + '/js/page-inject.js';
(document.head || document.documentElement).appendChild(scriptElement);

我想在“page-inject.js”中使用它，而不是“content.js”

我认为这很简单，但经过几个小时的重试和搜索后失败了。

我有一个像这样的background.js:

chrome.tabs.query({active: true, currentWindow: true}, 
function(tabs) {
  chrome.tabs.executeScript(tabs[0].id, {
    code: 'window.my_var = 123'
  }, function() {
    chrome.tabs.executeScript(tabs[0].id, {file: 'js/content.js'});
  });
});

此后，当我在该页面的控制台中键入“window.my_var”时。它不起作用。通缉的“123”没有出现。

如果我将 code: 'window.my_var = 123' 替换为 alert(123)，它就会起作用。但我需要的只是将一个变量从我的后台脚本 (background.js) 传递到我的扩展注入(inject)的网页。

我的尝试有什么问题吗？

Answer 1

正如 @wOxxOm 已经指出的那样，您如何通过更改控制台中的 Top 来在网页控制台中使用 chrome.tabs.executeScript 查看变量注入(inject)。

还有另一种方法可以使用 messaging 轻松地将值从后台传递到内容脚本。 。

下面是一个简单的例子:

manifest.json

{
  "name": "test",
  "version": "0.0.1",
  "manifest_version": 2,
  "description": "Test ",
  "background": {
    "scripts": [
      "background.js"
    ]
  },
  "browser_action": {
    "default_title": "Test "
  },
  "permissions": [
    "*://*/*",
    "tabs"
  ], "content_scripts" : [{
            "matches" :  ["*://*/*"],
            "js" : ["content.js"]
        }]
}

background.js

  chrome.browserAction.onClicked.addListener(function(){
       chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
            chrome.tabs.sendMessage(tabs[0].id, {data: "some value"});
        });
    });

content.js

chrome.extension.onMessage.addListener(handleMessage);
function handleMessage(request) {
    console.log(request.data);
}