Snippet for parsing the NFT metadata using the Fetch API. Supports both URI and IPFS format.

parseNFTMetadata.js

async function parseNFTMetadata(metadata, ipfs_gateway = 'https://ipfs.io/ipfs/'){
    const applyIPFSGateway = function(uri){
        if(uri instanceof Array){
            return uri.map(i=>applyIPFSGateway(i));
        }else if(typeof uri === 'object'){
            Object.keys(uri).forEach(k=>{
                uri[k] = applyIPFSGateway(uri[k]);
            });
            return uri;
        }else if(typeof uri === 'string'){
            return uri.replace('ipfs://', ipfs_gateway);
        }else{
            return uri;
        }
    };
    try{
        const URI = new URL(metadata); // for testing if it error
        return applyIPFSGateway(await (await fetch(metadata)).json());
    }catch(e){
        return applyIPFSGateway(metadata);
    }
}

Create json metadata

function createJSONMetadata(json){
    return 'data:application/json,' + encodeURIComponent(JSON.stringify(json))
}