Error in Moralis NFT Dapp: "moralis.js:7402 Uncaught (in promise) Error: Web3Api not initialized, run Moralis.start() first"

Moralis General
#1

Hi. I’m following the tutorial on creating an NFT Dapp, but an error keeps appearing in my code and the dapp isn’t working.

The video on your channel (as far as I’ve been able to go, but it crashes when loading moralis.js:

The codes as shown in the video:

The site view (the metamask has already been connected and the transaction has been signed):

moralis
moralis1916×982 95 KB

Note that the following error appears on the console:
moralis.js:7402 Uncaught (in promise) Error: Web3Api not initialized, run Moralis.start() first

I’ve been trying to solve this for a few days and I’m not succeeding. How do I resolve these?

#2

Hey looked at your Main.js you need to initialize the web3 API, this is done by running Moralis.start().
To initialize add this in your Main.js initalizeApp func.

serverUrl = "https://xxxxxx:2053/server"
appId = "xxxxxx"
Moralis.start({ serverUrl, appId});

Hope that helps!

#3

Hello good afternoon. In the video they talk about writing the following code to boot:

Moralis.initialize("jAcAyruzIchs5uZcbzGAhz2yDnoHxuOzlT8yBC4a");
Moralis.serverURL = "https://gt4vx0s0or1s.usemoralis.com:2053/server";
async function initializeApp(){};
initializeApp();

My main.js: https://github.com/italoHonoratoSA/NFT-dapp/blob/main/NFT-dashboard/main.js

I changed to
appId= "jAcAyruzIchs5uZcbzGAhz2yDnoHxuOzlT8yBC4a";
serverURL= "https://gt4vx0s0or1s.usemoralis.com:2053/server";
Moralis.start({ serverURL, appId});

The console still has errors. Here’s the capture:

moralis2
moralis21919×997 112 KB

I tried adding it inside initializeApp() or else at the beginning of the code it doesn’t work either, as per these initialization guidelines:
https://docs.moralis.io/moralis-server/getting-started/connect-the-sdk#main.js-1

#4

that is an old syntax for Moralis SDK, the new syntax is with Moralis.start

#5

Friend RayRay suggested the code below:
appId= "jAcAyruzIchs5uZcbzGAhz2yDnoHxuOzlT8yBC4a";
serverURL= "https://gt4vx0s0or1s.usemoralis.com:2053/server";
Moralis.start({ serverURL, appId});

But it’s still not working. The code in Main.js updated:

What is missing for all this to work so far?

#6

what is the error that you get now with this new code?

#7

hey it should be, you forget to make appId and serverURL constants

const appId= "..."
const serverUrl = "..."
await Moralis.start(
{
serverURL:serverUrl,
appId:appId
}
)
#8

I think that is the problem with serverUrl vs serverURL

#9

I made this new code. New error: Uncaught SyntaxError: await is only valid in async functions and the top level bodies of modules

I also tried differentiating between Url and URL, it doesn’t work either.

#10

that syntax error is caused by something else, you should use the version with Url and then this the syntax with await

#11

I’m using:
const serverUrl = "https://gt4vx0s0or1s.usemoralis.com:2053/server";
const appId = "jAcAyruzIchs5uZcbzGAhz2yDnoHxuOzlT8yBC4a";
await Moralis.start({
serverUrl:serverUrl,
appId:appId,
});

But the same error appears Uncaught SyntaxError: await is only valid in async functions and the top level bodies of modules.

#12

ok, you could use Moralis.start without that await before it

#13

yess in your JS file you cannot use await outside of a function, define a new intializeApp function that is async like before and execute Moralis.start with await inside. Or if not don’t need any await outside of the function :raised_hands:

Also since the field has the same name as the variable, you can just shorten the syntax to:

Moralis.start({ appId, serverUrl });
#14

I still can’t get everything to work.
It seems that Moralis has changed a lot of things and for some reason the NFT ultimate video is no longer up to date.

Would the initializeApp function in the code be correct?

Okay, I’m using the shortcode for Moralis.start({ appId, serverUrl });

#15

some things may have changed since that tutorial was done.

what is the part that doesn’t work now?

#16

Moralis.Web3.authenticate is legacy syntax, use Moralis.authenticate instead, others I am not entirely sure. I think if you can drop some errors from the console here that’ll be helpful to debug :raised_hands:

#17

Hello. Could you tell me if this Moralis change is accompanied by documentation about Moralis functions and codes?

The site even connects the wallet, but in this part of the video I can’t proceed because it’s not showing the NFTs that are on opensea: https://youtu.be/tBMk1iZa85Y?t=5239

The errors are those two that I reported above:
moralis.js:7402 Uncaught (in promise) Error: Web3Api not initialized, run Moralis.start() first
it’s the
Uncaught SyntaxError: await is only valid in async functions and the top level bodies of modules

This last error I’m not able to understand what to change in the code, regarding the async function.

#18

first error should say that Moralis.start was not called, second error should say that await was not used properly

#19

This is currently working;

const appId = (“xxxx”);
const serverUrl = “https://xxx”;
Moralis.start({ serverUrl , appId })

async function initializeApp() {
let currentUser = Moralis.User.current();
if (!currentUser) {
currentUser = await Moralis.Web3.authenticate();
}

  const options = { address: "0xCC17dEE73208FEF52DD66440A0aEE91e3CeC530B", chain: "rinkeby" };
  const NFTs = await Moralis.Web3API.token.getAllTokenIds(options);

console.log(NFTs);
}

initializeApp();

2 Likes