IPFS Engineering: Reading metadata for your favourite project
I went down a bit of a rabbit hole trying to figure out how to read JSON metadata from IPFS cause I like a few projects (https://lootexplorers.quest). After going through a few JS projects (LOL I KNOW), I ended up on a super simple solution that probably will go unnoticed unless you look here. There’s a lot of Public IPFS gateways and one of my favourite providers for Eth provides an IPFS gateway (thank you Infura.io)
Getting an IPFS Url
If you venture to this contract here, you can find the Token URI method. If you slap in a number like 2395 ;) you will get a nice IPFS url.
ipfs://bafybeiczwkbxhktsnissq2wpcbs6qtk6zhnr2ctyuduaxwk26ta643ozqq/metadata/2395
Your instinct will be copy/pasta that into your browser window… and you will be disappointed. Chrome doesn’t know wtf that is… So then you think Extension? right? Well let me just stop you there. Extensions aren’t going to help you in your quest for building something cool. Enter the gateway.
Something so Simple
Buried away in the Infura Docs you can find this. This magic means all you need to do to covert the URL into something useful is;
console.log("ipfs://bafybeiczwkbxhktsnissq2wpcbs6qtk6zhnr2ctyuduaxwk26ta643ozqq/metadata/2395".replace('ipfs://', 'https://infura-ipfs.io/ipfs/'));
Now you have a URL where you can get some metadata JSON :).