HTML导入无法在Chrome中运行

ser*_*aph 1 html google-chrome polymer

根据这篇文章,可以在除最新版Chrome之外的浏览器上使用HTML Imports via Polymer(这可能是目前唯一支持HTML Imports的浏览器).但是,使用以下html,改编自同一篇文章:

1.HTML

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Basic HTML Imports</title>
    <!-- Pull in our blog post example -->
    <link rel="import" href="2.html">

  </head>
<body>
  <p>Hello World!</p>
<script src="platform.js"></script>
<script>
      window.addEventListener('HTMLImportsLoaded', function() {
        var link = document.querySelector('link[rel=import]');
        var content = link.import.querySelector('#test');
        document.body.appendChild(document.importNode(content, true));
      });
    </script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

2.HTML

<div id="test">
  <h1>Here is the Import </h1>
</div>
Run Code Online (Sandbox Code Playgroud)

我得到以下结果.

它似乎<div id="test">在Firefox中成功导入,但在Chrome中未导入.请注意,我尝试在about:flags中启用实验性Web平台功能.

有没有什么方法可以让它适用于Chrome?我正在寻找任何解决方案,使我能够使用基本导入与Firefox和Chrome的最新版本.(我的项目要到2016年初才能上线,所以我希望到那时每个平台都能提供标准支持,但同时解决方法也很棒.)谢谢.

Leo*_*Leo 5

您似乎使用的是file:协议,它被跨源资源共享策略阻止.

关于HTML Imports的W3C规范:

必须使用模式设置为"匿名"的可能启用CORS的提取来加载从作为主文档的文档或导入映射中的文档链接的所有导入.

您可以尝试在localhost上运行服务器,这会有所帮助.