Upload file to IPFS through react

Moralis General
#1

I see in moralis-v1 docs https://v1docs.moralis.io/moralis-dapp/files/ipfs it shows us the way to upload file to ipfs through moralis cloud functions. When used with NextJs it throws back the error
Error: You need to call Moralis.start with an applicationId before using Moralis.
Note: I’ve already declared the appId and serverURL in _app.tsx. I can’t understand the issue here any help please…

#2

Maybe because the upload function is trying to get executed before the server is started.

Try using a if condition to check if isInitialized is true, before uploading to ipfs.

const { isInitialized } = useMoralis()
#3

Can you also post your _app.tsx code.

#4 
            <MoralisProvider
              appId={process.env.NEXT_PUBLIC_APP_ID}
              serverUrl={process.env.NEXT_PUBLIC_SERVER_URL}
            >
              {getLayout(<Component {...pageProps} />)}
              <SettingsButton />
              <SettingsDrawer />
              <ModalsContainer />
              <DrawersContainer />
            </MoralisProvider>

My _app.tsx looks like this.

#5

Can you test by hardcoding the serverUrl and appId values in your MoralisProvider instead of using environment variables.

If that wasn’t the issue and you still get the error, can you post how you’re using Moralis (from any imports from react-moralis) in any of the other files. You can look at doing what johnversus said if you’re trying to use Moralis functions on component load (mount).