在google chrome扩展中加载外部javascript

我正在编写一个谷歌浏览器扩展，它可以操纵当前页面（基本上是添加一个按钮）。在google chrome扩展中加载外部javascript

在我的内容脚本，我要加载Facebook的图形API：

$fbDiv = $(document.createElement('div')).attr('id', 'fb-root'); 
$fbScript = $(document.createElement('script')).attr('src', 'https://connect.facebook.net/en_US/all.js'); 
$(body).append($fbDiv); 
$(body).append($fbScript); 

console.log("fbScript: " + typeof $fbScript.get(0)); 
console.log("fbScript parent: " + typeof $fbScript.parent().get(0)); 
console.log("find through body: " + typeof $(body).find($fbScript.get(0)).get(0));

然而，剧本似乎并没有加入到body。这里的控制台日志：

fbScript: object 
fbScript parent: undefined 
find through body: undefined

任何想法我做错了什么？

来源

2011-10-16 Gezim

是有一些原因，你不能只包括Facebook的JS为您的内容脚本之一？ – sdleihssirhc

我试过，但我甚至无法在扩展窗口中加载脚本。它出现了这个错误：无法从'/Users/.../extentionfolder/'加载扩展。无法为内容脚本加载JavaScript'https://connect.facebook.net/en_US/all.js'。 – Gezim

这是因为您提供了外部参考，但Chrome期望脚本是本地的。我对Facebook Graph API不太熟悉;用您的扩展名保存本地副本有多可行？ – sdleihssirhc

的问题是内容的脚本里面的JavaScript在自己的沙盒环境中运行，只能访问其他的JavaScript加载两种方法之一：

经由manifest：

{ 
    "name": "My extension", 
    ... 
    "content_scripts": [ 
    { 
     "js": ["https://connect.facebook.net/en_US/all.js"] 
    } 
    ], 
    ... 
}

或者用Programmatic injection：

/* in background.html */ 
chrome.browserAction.onClicked.addListener(function(tab) { 
    chrome.tabs.executeScript(null, 
         {file:"https://connect.facebook.net/en_US/all.js"}); 
});

请务必更新您的清单权限：

/* in manifest.json */ 
"permissions": [ 
    "tabs", "https://connect.facebook.net" 
],

追加脚本标记实际上会在包含页面的上下文中，在JavaScript有权访问的JavaScript沙箱之外评估JavaScript。另外，由于FB脚本要求“fb-root”位于DOM中，因此您可能需要使用编程方法，以便首先使用元素更新DOM，然后返回pass a message页面来加载Facebook脚本，以便可以通过内容脚本中加载的JavaScript访问它。

来源

2012-01-14 08:56:14

嗨，我在印象中，你需要做这个或什么... http://developer.chrome.com/extensions/contentSecurityPolicy.html ....但会这样的工作。现在。 –

根据https://developer.chrome.com/extensions/contentSecurityPolicy#resourceLoading –

，这不再正确，这将在内容页面上加载脚本，但我正在寻找在扩展中加载脚本 –

Google Chrome浏览器扩展程序不再允许直接注入外部代码，但仍然可以通过Ajax调用下载代码并将其作为代码块输入注入器。

chrome.tabs.query({active: true, currentWindow: true}, function(tabs) { 
    $.get("http://127.0.0.1:8000/static/plugin/somesite.js", function(result) { 
     chrome.tabs.executeScript(tabs[0].id, {code: result}); 
    }, "text"); 
});

来源：https://stackoverflow.com/a/36645710/720665

来源

2017-01-03 11:36:38

在google chrome扩展中加载外部javascript

回答

相关问题