无法在 google chrome 扩展中使用 jquery
Unable to use jquery in google chrome extension
我正在尝试使用 jquery 进行 post ajax 调用,我已经尝试了几乎所有关于 SO 的解决方案,但 none 似乎有效。我的清单是:
{"name": "__MSG_extName__",
"version": "0.1",
"manifest_version": 2,
"description": "__MSG_extDesc__",
"icons": {"16": "icon16.png", "128": "icon128.png"},
"background": {"persistent": false, "scripts": ["background.js"]},
"default_locale": "en",
"content_scripts": [
{
"matches": ["<all_urls>"],
"js": ["jquery-2.1.3.js"]
}
],
"permissions": ["contextMenus", "downloads", "downloads.open", "tabs", "http://*/*", "https://*/*"]}
background.js 文件如下:
chrome.downloads.onCreated.addListener(function(downloadItem) {
console.log("Download Link is " + downloadItem.url)
chrome.tabs.executeScript(null, { file: "jquery-2.1.3.js" }, function() {
console.log("jquery is loaded");
var linkSync = {
"document": {
"downloadLink": downloadItem.url,
"isSynced": false},
"safe": true
};
$.post("url/to/post",
linkSync,
function( data ) {
console.log("Success" + data );
});
});
});
我得到的错误是:
Download Link is http://www.mymp3song.com/files/download/id/33724
background.js:14 jquery is loaded
extensions::uncaught_exception_handler:8 Error in response to tabs.executeScript: ReferenceError: $ is not defined
at Object.callback (chrome-extension://kbhkaajolcelehoonafmkgaahfgphnok/background.js:22:2)
at chrome-extension://kbhkaajolcelehoonafmkgaahfgphnok/background.js:13:16
如您所见,我以编程方式和清单中都添加了 jquery.js,但 none 似乎有效。即使我删除其中任何一个,它也不起作用。有人能告诉我应该怎么做才能让它发挥作用吗?
将你的 json 修改为这个,它会为你工作
参考是 Here
"content_scripts": [ {
"js": [ "jquery.min.js", "background.js" ],
"matches": [ "http://*/*", "https://*/*"]
}]
如果您想让jQuery在您的后台页面中发挥作用,您需要将其添加到后台页面中。
您尝试使用的两种方法都是将代码添加到内容脚本上下文。
你需要的是:
"background": {
"persistent": false,
"scripts": ["jquery-2.1.3.js", "background.js"]
},
在您的后台页面中加载 jQuery。请注意顺序很重要。
我建议 Architecture Overview 看一看。
我正在尝试使用 jquery 进行 post ajax 调用,我已经尝试了几乎所有关于 SO 的解决方案,但 none 似乎有效。我的清单是:
{"name": "__MSG_extName__",
"version": "0.1",
"manifest_version": 2,
"description": "__MSG_extDesc__",
"icons": {"16": "icon16.png", "128": "icon128.png"},
"background": {"persistent": false, "scripts": ["background.js"]},
"default_locale": "en",
"content_scripts": [
{
"matches": ["<all_urls>"],
"js": ["jquery-2.1.3.js"]
}
],
"permissions": ["contextMenus", "downloads", "downloads.open", "tabs", "http://*/*", "https://*/*"]}
background.js 文件如下:
chrome.downloads.onCreated.addListener(function(downloadItem) {
console.log("Download Link is " + downloadItem.url)
chrome.tabs.executeScript(null, { file: "jquery-2.1.3.js" }, function() {
console.log("jquery is loaded");
var linkSync = {
"document": {
"downloadLink": downloadItem.url,
"isSynced": false},
"safe": true
};
$.post("url/to/post",
linkSync,
function( data ) {
console.log("Success" + data );
});
});
});
我得到的错误是:
Download Link is http://www.mymp3song.com/files/download/id/33724
background.js:14 jquery is loaded
extensions::uncaught_exception_handler:8 Error in response to tabs.executeScript: ReferenceError: $ is not defined
at Object.callback (chrome-extension://kbhkaajolcelehoonafmkgaahfgphnok/background.js:22:2)
at chrome-extension://kbhkaajolcelehoonafmkgaahfgphnok/background.js:13:16
如您所见,我以编程方式和清单中都添加了 jquery.js,但 none 似乎有效。即使我删除其中任何一个,它也不起作用。有人能告诉我应该怎么做才能让它发挥作用吗?
将你的 json 修改为这个,它会为你工作 参考是 Here
"content_scripts": [ {
"js": [ "jquery.min.js", "background.js" ],
"matches": [ "http://*/*", "https://*/*"]
}]
如果您想让jQuery在您的后台页面中发挥作用,您需要将其添加到后台页面中。
您尝试使用的两种方法都是将代码添加到内容脚本上下文。
你需要的是:
"background": {
"persistent": false,
"scripts": ["jquery-2.1.3.js", "background.js"]
},
在您的后台页面中加载 jQuery。请注意顺序很重要。
我建议 Architecture Overview 看一看。