How to fix CORS error while uploading file via moralis ipfs

Hi everyone,
I have an cors error while uploading image or object to ipfs using morails.

Here is my code:

const metadata = {
  "name": itemName,
  "description": description,
  "collection": collection
};
const file = new Moralis.File("file.json", {base64: btoa(JSON.stringify(metadata))});
await file.saveIPFS();
console.log(file.ipfs(), file.hash());

==================
and then error:

How can I fix this error?

Hope quick response. (urgent problem)

Regards,


Detailed Error Screenshot

CORS Error: PreflightMissingAllowOriginHeader

Is your server active?
Are you using VPN?

How big was the file?

no, I am trying on my local.

logo file size is 104KB.

I have the same issue when saving very simple json object.
Can you help me?

from the error it looks like the server url and app id are not properly set

does it work to authenticate or to run a simple cloud function?

I had set my moralis server url and app id on .env file.

REACT_APP_MORALIS_APPLICATION_ID=“NF61JEeIFCKuMHhvnoxLNQfiWcdtJyA9qMwg3VRO”
REACT_APP_MORALIS_SERVER_URL=“https://jj5rhkmimjlh.usemoralis.com:2053/server

NOTE: I am developing and trying on my local with port 3000.
http://localhost:3000

Any issues?

The problem is other moralis like useChain, useMoralisWeb3Api, useWeb3ExecuteFunction, useMoralisQuery does work well.
but, Moralis.File and saveIPFS doesn’t work.

If I use “moesif cors” browser extension on chrome, saveIPFS does work.

So, I am not sure how to fix this problem.

Hope quick solution.

Thanks

try to hardcode those values, or not to use " in an environment file

@cryptokid

It does work after Moralis.initialize and set Moralis.serverURL in hardcode.

Thanks for your help.

1 Like