svg 不显示在本地答案

【问题标题】：svg not displayed in localsvg 不显示在本地
【发布时间】：2019-05-09 14:39:34
【问题描述】：

我目前在本地机器上运行的 html 页面上使用 svg，而不是在服务器上。图片不显示：

<svg aria-hidden="true" class="slds-icon slds-icon-standard-lead slds-icon--small">
        <use xlink:href="SLDS202/assets/icons/standard-sprite/svg/symbols.svg#lead"></use>
</svg>

路径是对的。在本地机器上，我的印象是我们无法运行使用部分。那正确吗？我在服务器上并在本地计算机上没有看到任何限制。

这段代码在本地运行良好：

 <svg version="1.1" baseProfile="full" width="300" height="200" xmlns="http://www.w3.org/2000/svg">
     <rect width="100%" height="100%" fill="red" />
     <circle cx="150" cy="100" r="80" fill="green" />
     <text x="150" y="125" font-size="60" text-anchor="middle" fill="white">SVG</text>
  </svg>

检查控制台时，我收到此错误：

  Unsafe attempt to load URL file:///C:/work/References/SLDS/SLDS202/assets/icons/utility-sprite/svg/symbols.svg#filterList from frame with URL file:///C:/work/References/SLDS/axa-hk-gi-demo.html.
 'file:' URLs are treated as unique security origins.

【问题讨论】：

如果您使用的是 Chrome，它的安全模型会阻止本地文件引用不同目录中的其他文件。 Firefox 的安全模型允许本地文件引用其他本地文件，前提是所引用的文件位于引用者的同一目录或子目录中。
SLDS202 文件夹是我的 html 页面所在的子文件夹。路径是对的。我认为在本地 html 中无法评估该部分：symbol.svg#lead。我错了吗？
好问题。现在我注意到在 mozilla 中它渲染得很好，但不是在 chrome 上，而且我默认使用 chrome。但它只在本地被阻止，在它显示的服务器上评估我的页面时。
你读过我第一条评论的第一句话吗？鉴于您的回复，这似乎是您的问题？
是的，你是对的。这是问题:)

标签： html svg

【解决方案1】：

引用@RobertLongson 的评论应该是一个答案：

如果您使用的是 Chrome，它的安全模型会阻止本地文件引用不同目录中的其他文件。 Firefox 的安全性模型允许本地文件引用其他本地文件，前提是引用的文件在同一目录或子目录中推荐人。

【讨论】：