Metamask NFT Standard

Developer Discussion
1

What metadata standard should be used for MetaMask, so the image is displayed?

I’ve tried these ones:

{
  "name": "Totem Állat",
  "description": "NFT about the Totem Állat",
  "image": "https://gateway-proxy-bee-1-0.gateway.ethswarm.org/bzz/b1ebae12875dce72c41e4c34be32168d47bc9325ba55d35f2479fe28d4ffe81a/kutya.jpg"
}

{
  "title": "Asset Metadata",
  "type": "object",
  "properties": {
    "name": {
      "type": "string",
      "description": "Solar Punk Totem Állat"
    },
    "description": {
      "type": "string",
      "description": "NFT about the Solar Punk Totem Állat."
    },
    "image": {
      "type": "string",
      "description": "https://gateway-proxy-bee-1-0.gateway.ethswarm.org/bzz/b1ebae12875dce72c41e4c34be32168d47bc9325ba55d35f2479fe28d4ffe81a/kutya.jpg"
    }
  }
}

I have seen some tickets in the forum, that also say that they can’t see the image, and they haven’t been solved, or not all of them. I also can’t see the image in the block explorer, but OpenSea will display them, both of them.

2

Hi @optr, welcome to the MetaMask community,

I am not an expert on this, but trying to help.

This seems to be based on the OpenSea metadata standard and that should be why you can view the NFTs on OpenSea.

The following docs are related. Please check them and see if they can help.

4 Likes
3

I still couldn’t solve it.

4

Are you using any platforms to make the NFTs? If yes, which platform is it?

2 Likes
5

No, I deployed a smart contract. This is the smart contract:

// SPDX-License-Identifier: MIT
pragma solidity ^0.8.20;

import "@openzeppelin/contracts@5.0.0/token/ERC721/ERC721.sol";
import "@openzeppelin/contracts@5.0.0/token/ERC721/extensions/ERC721URIStorage.sol";
import "@openzeppelin/contracts@5.0.0/token/ERC721/extensions/ERC721Burnable.sol";
import "@openzeppelin/contracts@5.0.0/access/Ownable.sol";

contract TotemAllat is ERC721, ERC721URIStorage, ERC721Burnable, Ownable {
    constructor(address initialOwner)
        ERC721("TotemAllat", "TOTEM")
        Ownable(initialOwner)
    {}

    function safeMint(address to, uint256 tokenId, string memory uri)
        public
        onlyOwner
    {
        _safeMint(to, tokenId);
        _setTokenURI(tokenId, uri);
    }

    // The following functions are overrides required by Solidity.

    function tokenURI(uint256 tokenId)
        public
        view
        override(ERC721, ERC721URIStorage)
        returns (string memory)
    {
        return super.tokenURI(tokenId);
    }

    function supportsInterface(bytes4 interfaceId)
        public
        view
        override(ERC721, ERC721URIStorage)
        returns (bool)
    {
        return super.supportsInterface(interfaceId);
    }
}
6

Thanks for the reply.
I am not experienced on this.
I am not sure, but using the Open Graph Protocol (OGP) metadata standard “may” resolve the issue.

In the meantime, hopefully, another professionals from the group can help.

3 Likes
7

Thanks @Maryam! @0xroo can help here please :pray:

And @optr no worries but best to put in Developer Discussion category next time

3 Likes
8

Hi @optr which network and is it testnet or mainnet?

3 Likes
9

ERC721
It’s Sepolia, but Polygon also didn’t work.
Tried this

{
  "name": "Totem Állat",
  "description": "NFT about the Totem Állat",
  "image": "https://gateway-proxy-bee-1-0.gateway.ethswarm.org/bzz/b1ebae12875dce72c41e4c34be32168d47bc9325ba55d35f2479fe28d4ffe81a/kutya.jpg"
}

and this

{
  "title": "Asset Metadata",
  "type": "object",
  "properties": {
    "name": {
      "type": "string",
      "description": "Solar Punk Totem Állat"
    },
    "description": {
      "type": "string",
      "description": "NFT about the Solar Punk Totem Állat."
    },
    "image": {
      "type": "string",
      "description": "https://gateway-proxy-bee-1-0.gateway.ethswarm.org/bzz/b1ebae12875dce72c41e4c34be32168d47bc9325ba55d35f2479fe28d4ffe81a/kutya.jpg"
    }
  }
}

metadata structure.

This is on Polygon: opensea .io/assets/matic/0xbB763d040E98230D49e5335c6f11D1008c55Af0D/0

10

Please check this issue: IPFS protocol not working for NFT metadata/images · Issue #2817 · MetaMask/metamask-mobile · GitHub are you using ipfs looks like there was an issue with the code. There is also contract metadata package you can try: GitHub - MetaMask/contract-metadata: A mapping of ethereum contract addresses to broadly accepted icons for those addresses. someone has a similar issue with several networks: The metadata and the image of the NFTs are not displayed · Issue #1279 · MetaMask/contract-metadata · GitHub
Another thing you can do is to use nft api supported by multiple node providers.

Have you tried to run this code could you share repro steps I could try it on my side as well. Do you maybe have a public repo that I could have a look, thanks.

Please note that only mobile would work atm.

2 Likes
11

It’s not on IPFS. It’s on Swarm. And it’s important that it’s on Swarm, because we are related to Swarm.

The code is very simple, I just deploy this in Remix:

// SPDX-License-Identifier: MIT
pragma solidity ^0.8.20;

import "@openzeppelin/contracts@5.0.0/token/ERC721/ERC721.sol";
import "@openzeppelin/contracts@5.0.0/token/ERC721/extensions/ERC721URIStorage.sol";
import "@openzeppelin/contracts@5.0.0/token/ERC721/extensions/ERC721Burnable.sol";
import "@openzeppelin/contracts@5.0.0/access/Ownable.sol";

contract TotemAllat is ERC721, ERC721URIStorage, ERC721Burnable, Ownable {
    constructor(address initialOwner)
        ERC721("TotemAllat", "TOTEM")
        Ownable(initialOwner)
    {}

    function safeMint(address to, uint256 tokenId, string memory uri)
        public
        onlyOwner
    {
        _safeMint(to, tokenId);
        _setTokenURI(tokenId, uri);
    }

    // The following functions are overrides required by Solidity.

    function tokenURI(uint256 tokenId)
        public
        view
        override(ERC721, ERC721URIStorage)
        returns (string memory)
    {
        return super.tokenURI(tokenId);
    }

    function supportsInterface(bytes4 interfaceId)
        public
        view
        override(ERC721, ERC721URIStorage)
        returns (bool)
    {
        return super.supportsInterface(interfaceId);
    }
}
12

But the image is linked web2 way, not something like bzz://

The domain which should be contacted for downloading the image is gateway.ethswarm.org

13

Thanks I’m not familiar with swarm unfortunately, were you able to find the solution?

14

This topic was automatically closed after 30 days. New replies are no longer allowed.