HTTPAPI根据合约和NFT ID获取nft的图片？

Question

我尝试了很多不同的想法，但无法找到如何通过 HTTP 请求获取 NFT 的图像。我试图找到一个 HTTP API returns 令牌 URI，但找不到任何东西。没有令牌 URI，我无法在 ipfs 上找到图像。

Answer 1

如果获取到NFT的“tokenUri”，粘贴到浏览器中

      ipfs://tokenUriHERE

您将看到 json 格式的 NFT 元数据。

{
   "name": "name it",
   "image": "ipfs://QmR36VFfo1hH2RAwVs4zVJ5btkopGip5cW7ydY4jUQBrKW",
   "description": "description",
   "attributes": [
        {
          "trait_type": "Artist",
          "value": "value"
        },
] }

如果您获得图像 URL 并将其粘贴到浏览器，您将看到该图像。

如果你想写一个代码来获取数据，只需发送get请求到 ipfs://tokenUriHERE获取JSON，检索图像然后获取图像。

或者您可以使用图书馆。在 javascript、web3.storage

import { Web3Storage } from 'web3.storage'

const token = process.env.API_TOKEN
const client = new Web3Storage({ token })

async function retrieveFiles () {
  const cid =
    'bafybeidd2gyhagleh47qeg77xqndy2qy3yzn4vkxmk775bg2t5lpuy7pcu'
  // You can fetch data using any CID, even from IPFS Nodes or Gateway URLs!
  const res = await client.get(cid)
  const files = await res.files()

  for (const file of files) {
    console.log(`${file.cid}: ${file.name} (${file.size} bytes)`)
  }
}

retrieveFiles()

Answer 2

如果您使用 React 进行构建，spectre.xyz 中有一个很棒的库 use-nft，它有助于抽象出 NFT 元数据的不一致格式，从而为您提供相关的 URL 用于显示图片。

您可以安装它：

npm install --save use-nft ethers

在使用它之前，您必须将您的应用程序包装在提供程序中，如图所示here，但实际使用起来非常简单。

function Nft() {
  const { loading, error, nft } = useNft(
    "0xd07dc4262bcdbf85190c01c996b4c06a461d2430", // NFT contract address
    "90473" // token ID
  )

  // nft.loading is true during load.
  if (loading) return <>Loading…</>

  // nft.error is an Error instance in case of error.
  if (error || !nft) return <>Error.</>

  // You can now display the NFT metadata.
  return (
    <section>
      <h1>{nft.name}</h1>
      <img src={nft.image} alt="" />
      <p>{nft.description}</p>
      <p>Owner: {nft.owner}</p>
      <p>Metadata URL: {nft.metadataUrl}</p>
    </section>
  )
}

HTTPAPI根据合约和NFT ID获取nft的图片？

HTTP API to get the image of an nft based on contract and NFT ID?

api

blockchain

cryptocurrency

nft