谷歌浏览器扩展相对路径 [英] Google Chrome extension relative path

问题描述

我正在开发Google Chrome扩展程序，并且遇到相对路径问题。
如果我给出一个图像的相对路径并在特定页面中打开插件，它将在网站路径中查找该图像，而不是扩展名。

I'm developing a google chrome extension and I'm running into a relative path problem. If I give a relative path to an image and open the plugin in a certain page it will look for that image in the website's path rather than the extension's.

任何想法？

推荐答案

如果您在扩展页面中使用CSS（背景，弹出窗口，信息栏等）可以使用相对路径（ / ）：

If you're using CSS in your extension pages (background, popup, infobar, etc) then you can use relative paths with a slash (/):

background-image:url("/sprites.png");

上面应该可以，每个人都使用它。但是，如果您将它用于内容脚本，并且您可以对任何css执行相同操作，则需要使用预定义的消息，如：

The above should work, everyone uses it. But, if your using it for content scripts and you can do the same for any css, you would need to use the predefined message like:

background-image:url('chrome-extension://__MSG_@@extension_id__/sprites.png');

如果您想以编程方式设置它，您可以使用 chrome.extension.getURL 语法如下：

If you want to programmatically set it, you can use the chrome.extension.getURL syntax as following:

var url = chrome.extension.getURL('sprites.png');

以下是您可以引用特定网址/图片的方式。

These are the ways that you can refer to a specific url/image.

另外，如

In addition, as mentioned in this answer, if you place your image assets in a directory, these files are not accessible in the web page DOM automatically. The developer should specify the resources that can be loaded the page by using the "web_accessible_resources" setting in the manifest.json file:

这篇关于谷歌浏览器扩展相对路径的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！