为何SVG无法加载到Chrome扩展程序中? [英] Why won't the SVG load in chrome extension?

问题描述

我正在使用chrome扩展名向网站中注入一些HTML.在该代码中，我包含了SVG.但是，当我加载网站时，我会得到

I am injecting some HTML into websites using a chrome extension. In that code I am including an SVG. But when I load websites I get

Failed to load resource: the server responded with a status of 404 (Not Found) http://stackoverflow.com/questions/SVG/home-outline.svg

我所有的svg文件都位于一个名为SVG的文件夹中.我正在使用"web_accessible_resources": ["SVG/*.svg"]加载SVG文件，就像我已加载其他文件一样.为什么我的图像无法加载?

All of my svg files are in a folder called SVG. I am loading the SVG files with "web_accessible_resources": ["SVG/*.svg"] as I have loaded my other files. Why won't my image load?

<span class="menu_T">
    <button class="large_menu_button_T">
        <img src="SVG/home-outline.svg">
    </button>
</span>

当我尝试通过CSS背景添加svg时，得到相同的结果.

I get the same result when I try to add the svg through css background.

推荐答案

在注入的代码中，相对路径(例如"SVG/home-outline.svg")指向您要注入的站点.

In the injected code, relative paths like "SVG/home-outline.svg" point to the site you're injecting to.

您需要扩展中资源的完整路径.很容易得到它: chrome.runtime.getURL("SVG/home-outline.svg")可以完成工作.

You need a full path to the resource in your extension. It's easy to get it: chrome.runtime.getURL("SVG/home-outline.svg") does the job.

这篇关于为何SVG无法加载到Chrome扩展程序中?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！