4

我使用 infura API 和 ipfs-http-client 在 ipfs 上上传了 jpg 图像。该文件取自 type=file 的输入。事件监听器是 onchange。

// imports
const IpfsHttpClient = require("ipfs-http-client");
const ipfsC = IpfsHttpClient({
  host: "ipfs.infura.io",
  port: "5001",
  protocol: "https",
});

<input type="file" onChange={(e) => { upload(e); }} />

  const upload = async (e) => {
    const file = e.target.files[0];
    const added = await ipfsC.add(file, {
      progress: (prog) => console.log(`received: ${prog}`),
    });
    console.log(added)
  };

我得到的哈希是QmQnSWbsck26xrFRiowdV2JhP7cbKRc9KbjWinRhmJgiMa。现在我正在尝试检索图像并将其显示在网络应用程序上。我应该如何进一步。

4

2 回答 2

2

这是一个 v0 CID。您可以在此处的 IPFS 文档中了解有关 CID 和不同版本的更多信息。

您可以使用 CID 检查器查看有关编码信息的更多信息：

https://cid.ipfs.io/#QmQnSWbsck26xrFRiowdV2JhP7cbKRc9KbjWinRhmJgiMa

或者，您可以从 IPFS 网关通过 HTTP 加载它。其中有很多，其中一些在IPFS Public Gateway Checker中列出。

您可以通过任何网关加载 - 但是请注意，网关可以看到您的请求！

使用 IPFS HTTP 网关 URL 的最佳和最安全的方法是获取 v1 CID，该 CID 的编码方式与 HTTP URL 的工作方式兼容。它还确保了基于源的安全性（如果它是一个 HTML URL 并执行代码）。

所以在你有变量的代码中added，你可以这样做：

let v1CID = added.cid.toV1()

在您的情况下，该值将是：

bafybeibekkxkexvbw65ma4syafzfnxtumfx7wjkbtaf2zfsoypmshn6ccu

您现在可以构造一个指向网关的 URL，例如：

https://bafybeibekkxkexvbw65ma4syafzfnxtumfx7wjkbtaf2zfsoypmshn6ccu.ipfs.dweb.link

例如，您可以在标签中使用该 URL。

查看上面的公共网关检查器以查看支持此子域 URL 功能的 CloudFlare 网关等其他选项。

于 2020-11-30T14:44:11.223 回答
1 
function toBase32(value) {
    var cid = new CID(value)
    return cid.toV1().toBaseEncodedString('base32')
  }

这会将给定的 v0 哈希转换为 v1 哈希。然后可以按照Dietrich Ayala在上述答案中提到的那样检索图像。

于 2020-11-30T18:04:44.980 回答