在开发我的扩展并通过加载解压缩的扩展来测试它时,我能够获得正确的路径。
例如,以下代码指向我的一个图像并正确加载。
theIcon.src = chrome.runtime.getUrl(goatPath); // "chrome-extension://extensionID/img/myImage.png
我在弹出页面和内容脚本中都运行了上述代码。
但是,当我上传到Chrome网上应用店并发布打包版本时,我无法访问该资源,因为它正在尝试查找
铬扩展://的extensionID /铬延伸://extensionID/img/myImage.png
弹出页面错误
无法加载资源:net :: ERR_FILE_NOT_FOUND
内容脚本错误
拒绝加载chrome-extension:// kjohofijdcbjeanfinadbebghfegbhop / chrome-extension://kjohofijdcbjeanfinadbebghfegbhop/img/myimage.png。资源必须列在web_accessible_resources清单键中,以便由扩展名外的页面加载。
清单文件 -
{
"manifest_version": 2,
"name": "Feed the Goat",
"description": "Feed the Goat provides a fun way for you to stay focused so you can get more done.",
"version": "1.5",
"icons": { "16": "img/goat-icon16.png",
"32": "img/goat-icon32.png",
"128": "img/goat-icon128.png" },
"background": {
"scripts": ["event/background.js"]
},
"browser_action": {
"default_icon": "img/goat-icon.png",
"default_popup": "popup/authentication/authentication.html"
},
"content_scripts": [
{
"matches": ["<all_urls>"],
"js": ["content/content.js"]
}
],
"web_accessible_resources": [
"img/goat-icon128.png",
"img/goat-icon256.png",
"img/GarytheGoat-icon128.png",
"img/GarytheGoat-icon256.png",
"img/BillyBuck-icon128.png",
"img/BillyBuck-icon256.png",
"img/UncleUnicorn-icon128.png",
"img/UncleUnicorn-icon256.png"
],
"content_security_policy":"script-src 'self' https://cdnjs.cloudflare.com/ https://www.gstatic.com/ https://*.firebaseio.com https://www.googleapis.com https://use.fontawesome.com; object-src 'self'",
"permissions": [
"tabs",
"activeTab",
"<all_urls>",
"identity",
"idle",
"notifications",
"storage"
],
}
由于
答案 0 :(得分:2)
在你的manifest.json中尝试添加以下内容:
"web_accessible_resources": [
"img/*"
]
另外,请确保在dist(build)文件夹中有img
个带图像的文件夹。
“goatPath”应为img/myImage.png
和funnction应该像{<1}}这样的所有大写
chrome.runtime.getURL(goatPath)