问题 Chrome扩展程序getUrl无法在注入文件中运行


我正在开发Chrome扩展程序,有什么方法可以获得 chrome.extension.getURL('file path') 注入文件的方法?我无法从注入的文件访问上述方法。

的manifest.json

{
"name": "Name",
"version": "0.1",
"description": "Name chrome extension",
"background": {
"persistent": false,
"scripts": ["js/background.js"]
},
"permissions": [
"tabs", 
"https://*/*"
],
"content_scripts": [
{
  "matches": ["https://mail.google.com/*"],
  "js": ["js/content.js"],
  "run_at": "document_end"
}
],
"web_accessible_resources": [
"js/injected.js",
"html/popup.html"
],
"manifest_version": 2
}

injected.js

console.log("Ok injected file worked");
console.log("Url: ", chrome.extension.getURL('html/popup.html'));

contentScript.js

var s = document.createElement('script');
s.src = chrome.extension.getURL('js/injected.js');
(document.head || document.documentElement).appendChild(s);

1451
2017-10-15 09:04


起源

也可以看看 stackoverflow.com/questions/9515704/... - Rob W


答案:


不,你不能,一旦你在页面中注入脚本,它就无法访问 chrome.extension.getURl。但你可以在你的 injected script 和 content script。其中一种方法是使用自定义事件。

mainfest.json

{
"name": "Name",
"version": "0.1",
"description": "Name chrome extension",
"background": {
"persistent": false,
"scripts": ["js/background.js"]
},
"permissions": [
"tabs", 
"https://*/*"
],
"content_scripts": [
{
  "matches": ["https://mail.google.com/*"],
  "js": ["js/content.js"],
  "run_at": "document_end"
}
],
"web_accessible_resources": [
"js/injected.js",
"html/popup.html"
],
"manifest_version": 2
}

在你的 injected script :

console.log("Ok injected file worked");


document.addEventListener('yourCustomEvent', function (e)
{
    var url=e.detail;
    console.log("received "+url);
});

在你的 content script

var s = document.createElement('script');
s.src = chrome.extension.getURL('js/injected.js');
(document.head || document.documentElement).appendChild(s);

s.onload = function(){

  var url=chrome.runtime.getURL("html/popup.html");

  var evt=document.createEvent("CustomEvent");
  evt.initCustomEvent("yourCustomEvent", true, true, url);
  document.dispatchEvent(evt);
};

11
2017-10-15 09:38



我从注入的脚本var得到了未定义这是我的内容脚本“url = chrome.runtime.getURL('html / popup.html'); var evt = document.createEvent(”HTMLEvents“); console.log(”evet“ :“,evt); evt.initEvent(”Test initEvent“,true,true,url); document.dispatchEvent(evt);”这是我注入的脚本“document.getElementById(”sendButtonID“)。addEventListener('click',function(e){var url = e.url; console.log(”received“+ url);});” - Bharath Kumar
请仔细阅读答案。在注入的脚本中,您不会为自定义事件添加任何侦听器。 - Sid
你可以在这里看到我的代码 codeshare.io/iT8ad - Bharath Kumar
@BharathKumar我编辑了答案。检查它现在是否有效 - Sid
谢谢你的工作。 - Bharath Kumar


您必须在扩展清单的web_accessible_resources中提及file_path或file_names。
例如:
"web_accessible_resources":[ "styles/*", "yourfilename.js" ]
之后,您可以通过调用方法将文件放入注入的脚本中。 "chrome.extension.getURL('yourfilename.js')";


4
2017-10-15 11:55



我收到此错误“Uncaught TypeError:无法读取未定义的属性'getURL'” - Bharath Kumar
你可以分享你的代码库.. - Nishan Miranda
看到我修改了这个问题 - Bharath Kumar


加入扩展程序 manifest.json

"web_accessible_resources": ["*.js"]

“web_accessible_resources”手册页

然后,这些资源将通过URL chrome-extension:// [PACKAGE ID] / [PATH]在网页中提供,可以使用extension.getURL方法生成。


0
2018-02-07 08:05