web app - 更新文本文件的静态网站答案

【问题标题】：web app - static website which updates the text fileweb app - 更新文本文件的静态网站
【发布时间】：2020-10-11 15:38:27
【问题描述】：

我正在使用 CSS、JS、HTML 创建一个简单的购物清单网站，以便我和我的朋友可以使用它。我将免费将它托管到 GitHub。 GitHub 的问题在于它只能托管静态网站。因此，如果我更新我的列表，它只会在我的设备中更新，而不是在我朋友的设备中。

我在网上看过一些教程，它们使用服务器、数据库和动态内容。所以我的问题是，有没有办法像 将列表保存到 Github 中的文本文件 存储库而不使用动态站点。并且从这个文本文件中，每当我更新、删除、刷新页面时，JS 都可以再次获取列表。或者这样做会使其成为动态网站？

我想要一个静态网站，并为所有访问该网站的人更新购物清单。

感谢您的回答。我是 HTML、CSS、JS 的新手，我知道我在这里遗漏了一些东西。

【问题讨论】：

标签： javascript html css dynamic static

【解决方案1】：

我不知道任何涉及 Github 的好的解决方案，但我认为你最好使用类似 Firebase Firestore 的东西。它基本上是一个 nosql（类 JSON）数据库，您可以直接从客户端（javascript）访问它。您还可以获得 1 GiB 的免费数据，这对于您的用例来说绰绰有余。它们提供了一个易于使用的界面，因此您可以非常快速地保存和获取数据，这有点像在云中保存 JSON。希望这有助于解决您的问题。

【讨论】：

我检查了 Firebase。它可以使用并且非常容易学习。我会努力学习这项技术。谢谢。

【解决方案2】：

所以你可以使用浏览器存储的缓存文件，它是一个 JSON 文件（这对你来说也是一个很好的做法） - 请记住，信息流只是一种方式，即你要更新 chrome 中的 JSON 文件，他们将下载这个并传递数据）-

您要查看的文档是浏览器本地存储中的这个：

https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage

希望对你有帮助

谢谢-W

【讨论】：

这是否意味着只有我可以更新 JSON 文件而他们只能访问它？我想让所有人都能更新列表。感谢您的快速回复。
如果他们是精通技术的人，可以将请求推送到 github 以更新 JSON 文件，那么他们可以这样做（但老实说，我认为这将是一场噩梦，因为您需要跟踪所有更新以及谁是最新的） - 一个替代方法（hacky）是使用 googleSheets 并公开列表，然后使用获取请求（这是一个内置的 JS Web API 函数）来填充数据。但是请记住这一点——人们正是出于这些原因创建了数据库，可能是时候学习如何使用它们和 NODE.JS / EXPRESS 来处理这个问题了
使用数据库非常好。我只是想为此使用一个静态站点，因为在 Github 上托管是免费的。感谢您的回答。
如果这是您要寻找的答案，您能否将帖子标记为已回答。谢谢，希望对您有所帮助

【解决方案3】：

通常，正如您现在已经猜到的那样，GitHub 非常适合静态页面，如果您必须制作动态页面，您可能必须启动服务器和数据库。

尽管如此，有几种方法可以解决这个问题，首先，您可以在免费服务器上的某处托管 JSON 文件，例如 http://000webhost.com，然后使用 javascript 获取 JSON 文件并根据该数据在屏幕上转储一些内容.当然，您会注意到这需要额外的工作来创建一个简单的 API，将您的杂货数据存储在其他地方。如果您不想使用 000webhost，还有其他选择，只需使用关键字“免费托管”，您会在 google 上看到很多可供选择的选项。

另一种方法是使用 Web 存储，我说的是创建一个类似 javascript JSON 的对象作为您的数据并将其存储在本地存储中，完全取决于您将来要扩展多少，您可能会冒着填满您的风险浏览器存储磁盘，它可以走多远。然后你可以简单地用JS从存储中获取并显示在屏幕上。

另一种方法是通过手动硬编码代码库中的所有内容来完全保持静态。

总之，说到静态网站生成器，还有很多其他的替代方案可能会让您大吃一惊，看看我用来快速展示静态页面原型的这个。 - https://surge.sh

我希望这能让您知道现在该做什么？探索！

【讨论】：