Passing a current users wallet into the getnfts options

areed15 · August 24, 2021, 10:54pm

Login with Metamask

//connect to Moralis server Moralis.initialize("lRCkcYjDbFtpxYwnA4un13UtUi7RqBfVtyjx5g0n"); // Application id from moralis.io Moralis.serverURL = "https://kprjvwm59njt.moralisweb3.com:2053/server"; //Server url from moralis.io //Display login button and let user login async function login(){ console.log("login clicked"); var user = await Moralis.Web3.authenticate(); //wait for user to authenticate if(user){ console.log(user); //print user to console } // get NFTs for current user on Mainnet async function getNFTs(user){ const options = { chain: 'ethereum', address: '0x023286bce3570cbb1c26C64844cEfF38CcC48d1A'} const nfts = await Moralis.Web3.getNFTs(options); console.log(nfts) } I am running this code to have a user login with their metamask and display some nfts. How would I pass the current users wallet address into the address section of the options? Instead of just having it be to a set wallet address as it is now.

areed15 · August 24, 2021, 10:56pm

Better view of the code

async function login(){

  console.log("login clicked");

  var user = await Moralis.Web3.authenticate(); //wait for user to authenticate

  if(user){

    console.log(user); //print user to console

  }

    // get NFTs for current user on Mainnet

    async function getNFTs(){

const options = { chain: ‘ethereum’, address: ‘0x023286bce3570cbb1c26C64844cEfF38CcC48d1A’}

    const nfts = await Moralis.Web3.getNFTs(options);

cryptokid · August 25, 2021, 5:38am

Hi,
There is a new API now if you update the the latest moralis sdk (0.0.36)
https://docs.moralis.io/moralis-server/web3-sdk/account#getnfts

the new code would be (pasted from the documentation):

// get NFTs for current user on Mainnet
const userEthNFTs = await Moralis.Web3API.account.getNFTs();

// get testnet NFTs for user
const testnetNFTs = await Moralis.Web3API.account.getNFTs({ chain: 'ropsten' });

// get polygon NFTs for address
const options = { chain: 'matic', address: '0x...' };
const polygonNFTs = await Moralis.Web3API.account.getNFTs(options);

In order to get current metamask connected address you can use ethereum.selectedAddress

You’ll also have to update moralis server to latest version (now 0.0.250) for some functions to work properly.

areed15 · August 25, 2021, 9:01pm

Is this how I was supposed to input ethereum.selectedAddress? It is giving me an error for the line nfts.forEach(function(nfts){. This is the error: Uncaught (in promise) ReferenceError: nfts is not defined
at login (driews.html:38)

<title>html</title>

Login with Metamask

areed15 · August 25, 2021, 9:02pm

Code didnt copy.

<title>act</title>

Login with Metamask

areed15 · August 25, 2021, 9:02pm

Login with Metamask

areed15 · August 25, 2021, 9:03pm

Login with Metamask

//connect to Moralis server Moralis.initialize("lRCkcYjDbFtpxYwnA4un13UtUi7RqBfVtyjx5g0n"); // Application id from moralis.io Moralis.serverURL = "https://kprjvwm59njt.moralisweb3.com:2053/server"; //Server url from moralis.io //Display login button and let user login async function login(){ console.log("login clicked"); var user = await Moralis.Web3.authenticate(); //wait for user to authenticate if(user){ console.log(user); //print user to console } // get NFTs for current user on Mainnet async function getNFTs(){ const options = { chain: 'eth', address: 'ethereum.selectedAddress' }; const nfts = await Moralis.Web3API.account.getNFTs(options); console.log(nfts) } nfts.forEach(function(nfts){ let url = fixURL(nft.token_uri); fetch(url) .then(response => response.json()) .then(data => { $("content").html($("content").html()+"

"+data.name+"/h2"); $("content").html($("content").html()+"

"+data.description+"

"); $("#content").html($("#content").html()+""); }); }) } function fixURL(url){ if(url.startsWith("ipfs")){ return "https://ipfs.moralis.io:2053/ipfs/"+url.split("ipfs://ipfs/").slice(-1)[0]; } else{ return url+"?format=json" } } getNFTs()

cryptokid · August 25, 2021, 9:07pm

I guess that you want something similar to this code from this post: How To Get User NFTs? All NFTs Owned by Address - @Ivan on Tech Explains

areed15 · August 25, 2021, 9:36pm

He just pulls nfts from a wallet address in this video. He does not pass the current users information into the options. I can get that part of the code to work and the part where the user logs in and it gets the nfts. However when I add the ethereum.selectedAddress in the options the getNFTs functions doesnt seem to work.

cryptokid · August 26, 2021, 5:31am

That example to get nfts was with an older version of Moralis SDK, after you update to the latest version of the sdk (0.0.36) you can use https://docs.moralis.io/moralis-server/web3-sdk/account#getnfts

// get NFTs for current user on Mainnet
const userEthNFTs = await Moralis.Web3API.account.getNFTs();

// get testnet NFTs for user
const testnetNFTs = await Moralis.Web3API.account.getNFTs({ chain: 'ropsten' });

// get polygon NFTs for address
const options = { chain: 'matic', address: '0x...' };
const polygonNFTs = await Moralis.Web3API.account.getNFTs(options);

and in this case by default it will use current address if no address parameter is given.

You’ll also have to update Moralis server to latest version.

areed15 · August 28, 2021, 1:10am

I restarted my moralis server and updated the api. However, when I take the options part out of the getNFTs function I receive an error. Here is a picture of the error

code:

//connect to Moralis server

Moralis.initialize("lRCkcYjDbFtpxYwnA4un13UtUi7RqBfVtyjx5g0n"); // Application id from moralis.io

Moralis.serverURL = "https://kprjvwm59njt.moralisweb3.com:2053/server"; //Server url from moralis.io

//Display login button and let user login

async function login(){

  console.log("login clicked");

  var user = await Moralis.Web3.authenticate(); //wait for user to authenticate

  if(user){

    console.log(user); //print user to console

  }

    // get NFTs for current user on Mainnet

    async function getNFTs(){

     // const options = { chain: 'eth', address: 'ethereum.selectedAddress' };

      const nfts = await Moralis.Web3API.account.getNFTs();

    console.log(nfts)

    }

    

    nfts.forEach(function(nfts){

      let url = fixURL(nft.token_uri);

      fetch(url)

      .then(response => response.json())

      .then(data => {

          $("content").html($("content").html()+"<h2>"+data.name+"/h2");

          $("content").html($("content").html()+"<h3>"+data.description+"</h3>");

          $("#content").html($("#content").html()+"<img src='"+fixURL2(data.image)+"'></img>");

      });

})

  }

function fixURL(url){

  if(url.startsWith("ipfs")){

    return "https://ipfs.moralis.io:2053/ipfs/"+url.split("ipfs://ipfs/").slice(-1)[0];

  }

  else{

    return url+"?format=json"

  }

}

getNFTs()

cryptokid · August 28, 2021, 6:31am

Hi,
At first look it looks like this code nfts.forEach(function(nfts){ is not inside getNFTs function, so when it will get executed nfts variable will not be defined because getNFTs function was not called.

areed15 · September 6, 2021, 5:08pm

Alright, I think I get what you are saying. I was getting the error for the line getNFTs at the end of the code(it is now commented out.) This is now moved above the nfts.forEach(function(nfts){ This made the error go away but nothing displays after login. I also moved the end bracket } for the async function getNFT(){ to the end of the code. Is this where getNFTs should be moved too?

//Display login button and let user login

async function login(){

  console.log("login clicked");

  var user = await Moralis.Web3.authenticate(); //wait for user to authenticate

  if(user){

    console.log(user); //print user to console

  }

    // get NFTs for current user on Mainnet

    async function getNFTs(){

     // const options = { chain: 'eth', address: 'ethereum.selectedAddress' };

      const nfts = await Moralis.Web3API.account.getNFTs();

    console.log(nfts)

    //}

    

    getNFTs(

    nfts.forEach(function(nfts){

      let url = fixURL(nft.token_uri);

      fetch(url)

      .then(response => response.json())

      .then(data => {

          $("content").html($("content").html()+"<h2>"+data.name+"/h2");

          $("content").html($("content").html()+"<h3>"+data.description+"</h3>");

          $("#content").html($("#content").html()+"<img src='"+fixURL2(data.image)+"'></img>");

      

      });

    })

    )}

function fixURL(url){

  if(url.startsWith("ipfs")){

    return "https://ipfs.moralis.io:2053/ipfs/"+url.split("ipfs://ipfs/").slice(-1)[0];

  }

  else{

    return url+"?format=json"

  }

}

}

// getNFTs()

cryptokid · September 6, 2021, 5:19pm

This was an working example of what you want to do: How To Get User NFTs? All NFTs Owned by Address - @Ivan on Tech Explains

areed15 · September 7, 2021, 8:36pm

I have been able to get that example to work where you look at the NFTs of a certain wallet. I am trying to make the application get the wallet adress from the current user that is logged in. However when I dont pass any options into the getNFTs part of const nfts = await Moralis.Web3API.account.getNFTs(); I get an error at the end of the script for the getNFTS(). In the video you show here Ivan put the getNFTs at the end of the code.

cryptokid · September 7, 2021, 8:50pm

What is the error that you get?

areed15 · September 7, 2021, 9:13pm

Uncaught ReferenceError: getnfts is not defined
at riews.html:61 (line 61 is at the end of the code when getNFTs() is called)

areed15 · September 8, 2021, 12:08am

Here is the code.

async function getNFTs(){

         // const options = { chain: 'eth', address: 'ethereum.selectedAddress' };

          const nfts = await Moralis.Web3API.account.getNFTs();

        console.log(nfts)

                        

        nfts.forEach(function(nfts){

          let url = fixURL(nft.token_uri);

          fetch(url)

          .then(response => response.json())

          .then(data => {

              $("content").html($("content").html()+"<h2>"+data.name+"/h2");

              $("content").html($("content").html()+"<h3>"+data.description+"</h3>");

              $("#content").html($("#content").html()+"<img src='"+fixURL2(data.image)+"'></img>");

          

          });

        })

        }

    function fixURL(url){

      if(url.startsWith("ipfs")){

        return "https://ipfs.moralis.io:2053/ipfs/"+url.split("ipfs://ipfs/").slice(-1)[0];

      }

      else{

        return url+"?format=json"

      }

    }

  }

    getNFTs()

malik · September 8, 2021, 12:25am

Hi @areed15,

I tried running the same exact code with a user logged in, the API called happened successfully.

Make sure -

You are keeping the cloud server updated,
Have the latest version of the SDK
Make sure to initialise the Moralis instance at the beginning successfully. (you haven’t showed your initialisation here in the code, maybe that’s the issue over here.
Also, make sure to authenticate the user before running the getNFT query (another reason why your current logged in account might not be able to fetch but other addresses are)

Hope this helps.

areed15 · September 8, 2021, 4:50pm

Thank you for the help Malik. I really apprecaite you helping me Let me post more of the code so you have a better idea of what is going on.

I updated this yesterday, so I believe this was done.
I believe const nfts = await Moralis.Web3API.account.getNFTs(); is the latest version of the SDK. Correct me if I am wrong.
I think this is done? Check my code and let me know.
What do you mean authenticate the user before running getNFT? Why does it work with other adresses? New hear so an explination would help.

<title>Smart Contract</title>

Login with Metamask