如何在没有任何 Web 服务器的情况下在本地运行 Polymer？

Question

我使用 Polymer 为桌面应用程序设计了 UI。但是，当我在本地运行应用程序时，出现以下错误："Imported resource from origin 'file://' has been blocked from loading by Cross-Origin Resource Sharing policy: Received an invalid response. Origin 'null' is therefore not allowed access." 因为它是一个桌面应用程序，所以我不需要互联网连接，也不需要网络服务器。运行这个应用程序在本地有什么解决方案吗？谢谢

Answer 1

imports 没有网络服务器就无法工作，因为它可能违反某些浏览器的安全策略，我相信你知道这一点。

这里有几个解决方案：

使用带有 python 或 Node 的本地网络服务器来提供自定义元素
如果您使用 node-webkit 包装您的 HTML，它带有一个内置服务器，所以不用担心任何网络服务器

P.S。使用网络服务器始终是更安全的选择。

Answer 2

您可以在浏览器中打开使用 Polymer 的本地 HTML 文件，而无需运行本地主机服务器。但正如 Adi 提到的，您将无法导入本地 HTML 文件。这就是为什么您应该在与页面主体相同的文件中声明您的 Polymer 元素。

这是 1 个文件中的一个简单的 Hello Polymer 元素（从 Poligit 服务器导入 Polymer 库，而不是本地）。您可以将此文件保存在本地，并在您的浏览器中执行它，它应该可以在没有任何执行本地服务器的情况下工作。

<!DOCTYPE html>
<html lang="en">
<head>
    <!-- Polymer 2 -->
    <script src="https://polygit.org/webcomponentsjs+1.0.0-rc.5/components/webcomponentsjs/webcomponents-loader.js"></script>
    <link rel="import"  href="https://polygit.org/polymer+2.0.0-rc.2/components/polymer/polymer-element.html">

    
</head>


<!-- Body -->
  <body>
  <!-- Hello element definition -->
    <dom-module id="hello-element">
     <template>
      <span>Hello {{name}}!</span>
     </template>

     <script>
      class HelloElement extends Polymer.Element {
       static get is(){
        return "hello-element";
       }

       static get properties() {
        return {
         name : {
          type : String,
          value : "world"
         }
        }
       }
      }
      customElements.define(HelloElement.is, HelloElement);
     </script>
    </dom-module>

    <!-- Element instance -->
    <hello-element></hello-element>
    <p/>
    <hello-element name="Hammy"></hello-element>
  </body>

</html>

如何在没有任何 Web 服务器的情况下在本地 运行 Polymer？

How to run Polymer locally, without any web server?

polymer

这里有几个解决方案：

如何在没有任何 Web 服务器的情况下在本地运行 Polymer？