使用去中心化存储构建网站

今天的大多数网站都遵循后端服务器到前端代码的架构。但在 Web3 应用程序中，前端代码不具有与受智能合约保护的后端代码相同的去中心化性和弹性。那么如何使网站像智能合约一样具有弹性呢？

该体系结构似乎很简单：

1. 创建一个没有服务器的静态网站。
2. 在去中心化的存储空间托管代码。
3. 将“入口”放在一个地方，指向去中心化的地址。

为此，我们不得不进入去中心化存储的“兔子洞”。了解这些不同的解决方案可以帮助我们创建最去中心化的网站。

你可以在此处查看我们将要引用的所有代码。

1. 制作静态网站

由于我们试图开发“不可阻挡”的网站，我们需要确保我们没有单点故障的风险。如果我们的网站需要对中央控制的服务器进行 HTTPS 调用，我们就创建了一个故障点。

所以我们需要创建一个静态站点，其中的 HTML、Javascript 和 CSS 文件都是从去中心化的存储位置提取的，我们没有任何 Javascript 或服务器语言运行代码来帮助支持该站点。

对于熟悉 Web 开发的人来说，这是一项非常简单的任务。你可以创建一个包含 HTML、JS 和 CSS 的页面。然后你就完成了。还有更高级的框架可以帮助你做到这一点，例如 Gatsby、Hugo 和 Eleventy。

我们使用 NextJS 的静态导出功能来做展示页面，当然你也可以使用 React 或功能更强大的框架来做到这一点。我们创建了这个演示站点，它只是展示这只青蛙的图片，并且有一个指向 Discord 通过 32 小时的 FreeCodeCamp Javascript & Solidity 课程帮助开发者学习。

如果我们愿意，我们仍然可以让我们的网站与像以太坊这样的区块链作为后端进行交互，因为去中心化的后端不会再多增加一层中心化。

现在我们有了网站，接下来我们必须弄清楚在哪里托管它。

2. 托管站点：尝试使用 ETH

作为一名 Web3 开发者，我的第一个想法是：为什么不是以太坊？

现在，我们可以将所有数据存储在以太坊或其他 EVM 链上。但无论我们怎么做，它的代价都太过高昂。

与其尝试将我们的文件夹复制粘贴到合约中的存储变量中，更聪明的方法是将整个站点进行 base64 编码，将其编码为一个巨大的 URI，我们可以将其存储在一个或多个存储变量中。

我摆弄了几个小时，试图让这种方式在费用方面不那么夸张，然后我放弃了。即使在 Arbitrum 上，存储所有这些数据看起来也至少要花费 200 美元。但是，对于较小的站点，这将是一种可行的方法。

因此，我创建了一个质量很差的网站 SVG，对其进行 base64 编码并将其作为 NFT 发布在 Arbitrum 上。

现在，在看我的下一次尝试之前，使用 base64 编码，我用来使数据 URI 更小和更高效的一种方法是将我的网站代码扁平化到一个 HTML 文件中。这意味着手动检查我的 index.html 文件并用这些文件的 base64 编码替换对其他文件的引用，或者只是将代码复制粘贴到 HTML 文件中。

这很重要，因为我们将这种扁平化用于未来的尝试。因此，尽管我们认为 EVM 合约不是最好的，但我们仍然学到了很多东西，我们将在本文总结中再回到以太坊，将这些知识联系在一起。

3. 托管站点：尝试使用 dStorage

所以以太坊和其他 EVM 链不适合存储大量数据。那么，有什么其他的解决方案？

Sia、Arweave 和 Filecoin。

你会注意到我没有提到 IPFS。我们很快就会讨论 IPFS。

Arweave

让我们从 Arweave 开始。在 Arweave 上存储数据与在以太坊上存储数据几乎完全相同。一旦你存储了数据，它就会永远存在。这称为“基于区块链的数据持久性”，意思是每条数据都存储在 Arweave 网络上。正因为如此，在写这篇文章的时候这个区块链已经存储了 112 TB 的数据，即使它只存在了大约四五年。

因此，为了将数据存储在 Arweave 上，我需要运行一个 Arweave 节点……我不想这样做，所以我使用了一个名为 arkb 的集中式工具来发送数据以存储我的网站。它类似于以太坊的 Infura 或 Alchemy RPC URL，即一种 Arweave 节点即服务。对于 arkb，我不得不稍微扁平化我的网站，因为它只理解相对导入，而不理解 base64 编码的数据 URI。如果我运行自己的 Arweave 节点，我确信我可以使用我的数据 URI。

接下来就成功了，我们可以使用这个 Arweave 浏览器查看我们创建的用于将数据存储在 Arweave 上的交易，然后我们可以使用 Arweave 网关从区块链读取数据并呈现我们的网站！ Arweave 区块链上的所有数据都是公开的，因此请记住只更新你认为大家都能看到的数据！

下面是关于存储规模的说明。

你可能会想，“哇，112 TB 的数据量很大，Arweave 链如何保持增长才可行？” Arweave 有一些聪明的共识机制，可以更容易地不必在每个节点上拥有每一条数据，它已经对数据存储成本进行了研究，并认为数据存储将变得越来越便宜，因此不断增长的链规模不会是一个问题。但这是区块链普遍面临的一个问题，称为“状态爆炸”。

显示状态膨胀问题指数增长的图表

状态膨胀是指区块链拥有大量无用数据，不再需要或无法访问，但由于共识的工作方式，你需要所有数据来计算未来数据的哈希值。

因此，Sia 和 Filecoin 网络采用了不同的数据持久化方法，而不是使用“基于合约”的方法。

Sia

Sia 网络由存储数据的主机组成，这些主机与租户（renter）签订合约协议，合约存储在 Sia 的工作量证明区块链上。

使用 Sia，我可以通过查看文档来启动和运行自己的节点，没有问题，并且区块链只有大约 40 GB，因为链存储的是协议信息而不是数据本身。它甚至带有一个 UI！然后我能够将我们的数据放入 UI 中，以与 Sia 区块链上的其他节点达成交易。

Sia 使用周期性的挑战来强制主机保留数据，如果他们无法提交证明他们拥有数据的证据，他们将受到经济上的惩罚。

显示 Sia 如何使用周期性挑战强制主机保留数据的图表

现在这是我们遇到的第一个问题。 Sia 区块链是一个很注重安全性的链，我们的数据在存储时实际上会在许多主机之间进行拆分和加密，只有存储数据的人拥有私钥才能解密。因此，即使我可以看到数据的交易哈希，也只有我可以访问它，因为我是唯一拥有私钥的人。

这就是 Skynet 的用武之地，Skynet 是一种允许人们在其他人的节点上租用数据的工具，一种开源的 Sia 即服务。如果我们将数据上传到其他人的 Skynet 门户，这些门户会提供一种使用我们上传的文件夹或文件的哈希值自动呈现网站的方法。

这种方法的一个主要问题是我们必须相信他们正在为我们提供良好的数据并且没有篡改它。这意味着该网站也不会“不可被阻挡”。如果它们出现故障，我们将失去该站点。我们可以运行自己的门户网站，让人们可以访问我们的数据，并在我们的网站上发布证明，以便用户可以在他们这边进行验证，但这样用户门槛就太高了。

如果我们想创建一个只有我们才能访问的“不可被阻挡”的网站，例如内部网或私人文档，Sia 是完美的选择。

Sia 社区正在努力让这一切在未来变得更容易，我在他们的 Discord 中与他们进行了一些精彩的对话。

IPFS

现在，让我们简单谈谈 IPFS。你可能已经看到我们将 IPFS 用于 NFT 数据。 IPFS 是存储公共分布式数据的绝佳工具。你将数据放在 IPFS 节点上，获得哈希值，然后你可以将该哈希值共享给运行节点的人以验证数据。但它缺乏数据持久性。任何人都可以将数据添加到 IPFS 网络，允许任何人访问它，但如果没有人保留该数据，则没有人可以从哈希中获取数据。并且没有动力让某人固定数据。

因为它对于分布式数据来说是一个快速而可靠的选择，所以我们确实将我们的站点发布到 IPFS，并且我们至少可以将它存储到我们的节点。如果全世界的人都存储我们的网站，那这个网站可能会变得“不可被阻挡”。

我们所要做的就是对站点进行静态导出并将整个文件夹固定到 IPFS 上，现在我们可以将 CID 放入任何兼容 IPFS 的浏览器或任何具有 IPFS 扩展的浏览器中。

Filecoin

现在，这就是 Filecoin 的用武之地。Filecoin 是一种区块链，它为人们托管你的数据增加了经济激励，并在我们的 IPFS 哈希之上添加了数据持久性。

然而，即使在我自己运行了一个节点之后，现在将 Filecoin 与 IPFS 结合使用对我来说也太困难了。所以我打开了 web3.storage 来帮助我。 web3.storage 是一个集中式站点，有助于简化去中心化存储交易。它可能会阻止我与 Filecoin 的交易，然后我只需要回过头来弄清楚如何自己通过 Filecoin 节点达成一个交易。但是一旦我将数据放到 Filecoin 上，我就不再需要它们了（呵呵）。

与 Sia 类似，Filecoin 使用“基于合约”的数据持久性，但它不是“加密”你的数据，而是“密封”它。这意味着它是隐藏的，但任何人都可以支付检索节点来检索数据。 你可以通过查看 Filfox 区块浏览器（或探索我们的节点）来了解我们的网站在 Filecoin 网络上的持续时间。 Filecoin 节点在底层也是 IPFS 节点，并且可以选择将数据固定到 IPFS。然后我们也可以获取 CID 并将其放入我们的 IPFS 节点以呈现存储在 Filecoin 上的数据。

你可以将 Filecoin 想象成一个巨大的市场，例如 Sia，其中的节点正在签订合同并放置抵押品来存储数据。然后，区块链通过询问随机数据片段来定期挑战随机节点。如果他们丢弃数据，他们将受到惩罚。

所以我们可以确定我们的网站在 Filecoin 上是安全的，如果我们想把它永远保存在那里以及在 IPFS 节点上，我们只需要在每次启动时重新启动合约。目前 Filecoin 合约的时间不能超过两年，而且该节点比 Sia 节点大很多。

Filecoin 数据大小是 TB 级别，这增加了我在运行节点的困难。此外，Filecoin 不会自动将数据固定到 IPFS，这很好，因为我们也希望能够在 Filecoin 上存储数据，但大多数 Filecoin 节点都可以选择。我们确实在那里遇到了一些中心化问题，因为我们必须相信我们的 Filecoin 节点会固定我们的数据，并且没有动机让他们固定数据。我们可以让某人支付 Filecoin 节点以获取数据并显示 CID 以确保它是我们想要的数据，但这些解决方案仍在研究中。

所以我们遇到了 Sia 遇到的同样问题——没有私钥或我们自己无法访问节点，如果节点不固定我们的数据，我们是唯一可以查看我们网站的人。或者你必须随时为要从网络中提取的数据付费。

回顾最初的目标

为了让我们的网站真正“无法被阻挡”，我们：

1. 对站点进行快照并将其存储在以太坊上。
2. 将我们的网站存储在 Arweave 区块链上。
3. 将我们的网站存储在 Sia 区块链上，这样至少我们可以随时访问该网站。
4. 自己固定到 IPFS。
5. 让 Filecoin 节点也将其固定到 IPFS。

所以我们很好，对吧？这可能有点矫枉过正，但我​​们通过使用多个 dStorage 位置使我们的站点变得有冗余性。我们需要做的最后一件事是拥有某种类型的映射，表明我们的 uns ⊤ pab ≤ og 站点映射到这些不同的 dStorage 位置。

如果我们的网站有一个人类可读的版本而不是这些不可读的哈希值，那就太好了。

对我们来说幸运的是，我们知道有一条链是可靠的，我们可以使用它来将人类可读的名称映射到这些不同的位置，这就是以太坊名称服务。

ENS 是 ETH 区块链上的智能合约，您可以在其中将人类可读的名称映射到这些更复杂的哈希值。我们买了一个名为“unstoppablefrog.eth”的名称，并将我们的 IPFS 哈希添加到内容部分。那里有一个中心化服务器，可以将 .eth 域映射到名称的内容哈希中的任何内容，因此如果我将“unstoppable frog.eth”输入地址栏，我就会得到我们网站的渲染图。

如果该服务器出现故障，任何人仍然可以访问智能合约并自己获取哈希值，因此我们的数据是永久安全的。如果我们的 IPFS 哈希出现故障，我们可以查看描述部分并查看所有这些备份，任何人都可以路由到这些描述之一，而不是仅仅从内容中提取。这为某人提供了一个单一的规范位置，可以读取我们存储数据的所有不同分散位置。

希望我们的网站“不可被阻挡”。

Tor

我们可以做的最后一件事是为我们的“不可阻挡性”添加另一层，即为我们的 ENS 数据添加一个洋葱地址。洋葱地址是通过 Tor 浏览器的网站，Tor 浏览器是一种帮助匿名化用户的点对点网络。将我们的网站放在 Tor 上会增加一个难以删除的托管位置。

显示 Tor 如何加密数据的图表。原始来源：https://2019.www.torproject.org/about/overview.html.en

总结

我希望你能从中学到很多东西。下面是包含我所有代码、实验和笔记的 GitHub Repo，我期待将来使用 dStorage 作为我的智能合约的数据库，而 Chainlink 作为连接两者的中间件。

GitHub: https://github.com/PatrickAlphaC/unstoppable-ui

不可阻挡的网站：https://unstoppablefrog.eth.link/

欢迎关注 Chainlink 预言机并且私信加入开发者社区，有大量关于智能合约的学习资料以及关于区块链的话题！