时间戳

首页 > 解决方案 > 我的 HTML + JavaScript 代码适用于在线编辑器，但不能离线

html - 我的 HTML + JavaScript 代码适用于在线编辑器，但不能离线

问题描述

我正在使用表格，将谷歌表格转换为 JSON 文件，然后使用他们的 API 将 JSON 转换为 javascript 对象。

问题是代码在在线编辑器中工作得很好，就像 W3Schools 或 Codepen 的 Tryit 一样，但如果我将它放在 HTML 文件中并用 Chrome 或 Edge 打开它，它将无法工作。有谁知道为什么？如果我在线安装该站点，它会起作用吗？

<head>
  <!-- Add Sheetsu Web Client script to the head -->
  <script src="//script.sheetsu.com/"></script>
</head>

<body>
  <div id="list"></div>

  <script>
    // API returns array of objects
    // Iterate over them and add each element as a list element
    function successFunc(data) {
      data.forEach(function(item, i) {
        document.getElementById("list").innerHTML += "<li>" + item.Precio + " " + item.Tipo + "</li>";
      });
    }

    function errorFunc(e) {
      console.log(e);
    }

    Sheetsu.read("https://sheetsu.com/apis/v1.0su/110ccf6a6812", {}).then(successFunc, errorFunc);
  </script>
</body>

提前致谢

标签： htmljsonapigoogle-apps-scriptgoogle-sheets

解决方案

问题是这样的：

<script src="//script.sheetsu.com/"></script>

当您以“//”开头且没有协议 (http|https) 的资源/资产 URL 时，它与页面加载位置的协议相匹配。如果您直接打开本地 html 文件，则该协议变为file://，因此请求的 URL 最终为file://script.sheetsu.com/，当然不存在。

将其更改为：

<script src="https://script.sheetsu.com/"></script>

推荐阅读