πŸ“‘NFT Details

Learn how to fetch ERC721 & ERC1155 NFT details data, which includes name, symbol, NFT images (original & resized), metadata from a specific NFT or an NFT collection.

Airstack provides easy-to-use NFT APIs for enriching Web3 applications with onchain and offchain NFT data from Ethereum, Base, Degen Chain, and other Airstack-supported chains.

Table Of Contents

In this guide you will learn how to use Airstack to:

Pre-requisites

  • An Airstack account

  • Basic knowledge of GraphQL

Get Started

JavaScript/TypeScript/Python

If you are using JavaScript/TypeScript or Python, Install the Airstack SDK:

React

npm install @airstack/airstack-react

Node

npm install @airstack/node

Then, add the following snippets to your code:

import { init, useQuery } from "@airstack/airstack-react";

init("YOUR_AIRSTACK_API_KEY");

const query = `YOUR_QUERY`; // Replace with GraphQL Query

const Component = () => {
  const { data, loading, error } = useQuery(query);

  if (data) {
    return <p>Data: {JSON.stringify(data)}</p>;
  }

  if (loading) {
    return <p>Loading...</p>;
  }

  if (error) {
    return <p>Error: {error.message}</p>;
  }
};

Other Programming Languages

To access the Airstack APIs in other languages, you can use https://api.airstack.xyz/gql as your GraphQL endpoint.

πŸ€– AI Natural Language​

Airstack provides an AI solution for you to build GraphQL queries to fulfill your use case easily. You can find the AI prompt of each query in the demo's caption or title for yourself to try.

Get NFT Collection Total Supply

You can fetch an NFT collection's total supply by using the totalSupply field from Tokens API by providing NFT collection address as an input:

Try Code

Show me total supply of @BoredApeYachtClub

Demo

query TotalSupply {
  Tokens(
    input: {
      filter: { address: { _eq: "0xBC4CA0EdA7647A8aB7C2061c2E118A18a936f13D" } }
      blockchain: ethereum
    }
  ) {
    Token {
      totalSupply
    }
  }
}

Get NFT Name & Symbol

You can fetch an NFT collection's name and symbol by using the name and symbol fields from Tokens API by providing NFT collection address as an input:

Try Demo

Code

query MyQuery {
  Tokens(
    input: {
      filter: { address: { _eq: "0xBC4CA0EdA7647A8aB7C2061c2E118A18a936f13D" } }
      blockchain: ethereum
    }
  ) {
    Token {
      name
      symbol
    }
  }
}

Get NFT Metadata of Specific NFT

You can fetch an NFT's metadata (both raw and formatted version) by using the TokenNfts API by specifying NFT collection address and the NFT tokenId as an input:

Try Demo

Code

query MyQuery {
  TokenNfts(
    input: {
      filter: {
        address: { _eq: "0xBC4CA0EdA7647A8aB7C2061c2E118A18a936f13D" }
        tokenId: { _eq: "0" }
      }
      blockchain: ethereum
    }
  ) {
    TokenNft {
      tokenId
      rawMetaData
      metaData {
        name
        description
        image
        attributes {
          trait_type
          value
        }
      }
    }
    pageInfo {
      nextCursor
      prevCursor
    }
  }
}

Get NFT Metadata of An NFT Collection

You can fetch all NFTs' metadata (both raw and formatted version) in an NFT collection by using the TokenNfts API by providing NFT collection address as an input:

Try Demo

Code

query MyQuery {
  TokenNfts(
    input: {
      filter: { address: { _eq: "0xBC4CA0EdA7647A8aB7C2061c2E118A18a936f13D" } }
      blockchain: ethereum
    }
  ) {
    TokenNft {
      tokenId
      rawMetaData
      metaData {
        name
        description
        image
        attributes {
          trait_type
          value
        }
      }
    }
    pageInfo {
      nextCursor
      prevCursor
    }
  }
}

Get NFT Images of Specific NFT

You can fetch an NFT's image (both original and resized version) by using the TokenNfts API by specifying NFT collection address and the NFT tokenId as an input:

Try Demo

Resized NFT images size guide:

  • extra_small: 125x125px

  • small: 250x250px

  • medium: 500x500px

  • large: 750x750px

Code

query MyQuery {
  TokenNfts(
    input: {
      filter: {
        address: { _eq: "0xBC4CA0EdA7647A8aB7C2061c2E118A18a936f13D" }
        tokenId: { _eq: "0" }
      }
      blockchain: ethereum
    }
  ) {
    TokenNft {
      contentValue {
        image {
          extraSmall
          small
          medium
          large
          original # Original size of the NFT image
        }
      }
    }
  }
}

Get NFT Images of An NFT Collection

You can fetch all NFTs' images (both original and resized version) in an NFT collection by using the TokenNfts API by providing NFT collection address as an input:

Try Demo

Resized NFT images size guide:

  • extra_small: 125x125px

  • small: 250x250px

  • medium: 500x500px

  • large: 750x750px

Code

query MyQuery {
  TokenNfts(
    input: {
      filter: { address: { _eq: "0xBC4CA0EdA7647A8aB7C2061c2E118A18a936f13D" } }
      blockchain: ethereum
    }
  ) {
    TokenNft {
      tokenId
      contentValue {
        image {
          extraSmall
          small
          medium
          large
          original # Original size of the NFT image
        }
      }
    }
    pageInfo {
      nextCursor
      prevCursor
    }
  }
}

Get Specific NFT in An NFT Collection

You can fetch all individual NFTs' details in an NFT collection by using the TokenNfts API by providing NFT collection address and the NFT tokenId as an input:

Try Demo

Resized NFT images size guide:

  • extra_small: 125x125px

  • small: 250x250px

  • medium: 500x500px

  • large: 750x750px

Code

query MyQuery {
  TokenNfts(
    input: {
      filter: {
        address: { _eq: "0xBC4CA0EdA7647A8aB7C2061c2E118A18a936f13D" }
        tokenId: { _eq: "0" }
      }
      blockchain: ethereum
    }
  ) {
    TokenNft {
      tokenURI
      rawMetaData
      metaData {
        animationUrl
        attributes {
          displayType
          maxValue
          trait_type
          value
        }
        backgroundColor
        description
        externalUrl
        image
        imageData
        name
        youtubeUrl
      }
      contentValue {
        image {
          extraSmall
          small
          medium
          large
          original # Original size of the NFT image
        }
      }
    }
  }
}

Get All NFT In An NFT Collection

You can fetch all individual NFTs' details in an NFT collection by using the TokenNfts API by providing NFT collection address as an input:

Try Demo

Resized NFT images size guide:

  • extra_small: 125x125px

  • small: 250x250px

  • medium: 500x500px

  • large: 750x750px

Code

query MyQuery {
  TokenNfts(
    input: {
      filter: { address: { _eq: "0xBC4CA0EdA7647A8aB7C2061c2E118A18a936f13D" } }
      blockchain: ethereum
    }
  ) {
    TokenNft {
      tokenId
      tokenURI
      rawMetaData
      metaData {
        animationUrl
        attributes {
          displayType
          maxValue
          trait_type
          value
        }
        backgroundColor
        description
        externalUrl
        image
        imageData
        name
        youtubeUrl
      }
      contentValue {
        image {
          extraSmall
          small
          medium
          large
          original # Original size of the NFT image
        }
      }
    }
    pageInfo {
      nextCursor
      prevCursor
    }
  }
}

Developer Support

If you have any questions or need help regarding fetching NFT details data, please join our Airstack's Telegram group.

More Resources

Last updated

Was this helpful?