CORS Error when Uploading Video

I can successfully upload images as NFTs on my marketplace, but when I try to upload a video, I get the following errors:

"XMLHttpRequest failed: “Unable to connect to the Parse API”

and

Here is the function in which things fail. As you can see in the logs, initially saving the file to IPFS works, but for some reason fails when trying to store the rest of the metadata.

  async function createItem() {
    setUploadLoading(true)
    const re = /(?:\.([^.]+))?$/;
    const fileExt = re.exec(selectedFile.name)
    const fileName = 'file' + fileExt[0];

    const nftFile = new Moralis.File(fileName, selectedFile);

    try {
      const savedFile = await nftFile.saveIPFS()
      console.log('FILED SAVED')
      console.log(savedFile)

      const nftFilePath = savedFile.ipfs()
      const nftFileHash = savedFile.hash()

      const metadata = {
        name,
        description,
        image: nftFilePath
      };

      const nftFileMetadataFile = new Moralis.File("metadata.json", {base64: btoa(JSON.stringify(metadata))});
      const metadataSavedReceipt = await nftFileMetadataFile.saveIPFS();

      console.log('METADATA FILE SAVED')
      console.log(metadataSavedReceipt)

      const nftFileMetadataFilePath = nftFileMetadataFile.ipfs()
      const nftFileMetadataFileHash = nftFileMetadataFile.hash()

      const nftId = await mintNFT(nftFileMetadataFilePath);

      const Item = Moralis.Object.extend("Item")

      const item = new Item();
      item.set('name', name)
      item.set('description', description)
      item.set('nftFilePath', nftFilePath)
      item.set('nftFileHash', nftFileHash)
      item.set('metadataFilePath', nftFileMetadataFilePath)
      item.set('metadataFileHash', nftFileMetadataFileHash)
      item.set('nftId', nftId)
      item.set('nftContractAddress', contractAddress)

      console.log(contractAddress)

      await item.save();
      console.log(item)
    }
    catch(err) {
      alert('Error: ' + err.message)
      console.log(err)
    }
  }
1 Like

Hi Alek. How large is the video file? The max file size for saving to IPFS in Moralis is 64MB

https://docs.moralis.io/ipfs#saving-files

FYI the max size for saving files to the database is about 3MB.

Hey, thanks for letting me know.

The video file I tested with was 10mb. No where in my code am I accidentally saving the file to the database right? As far as I understand, the database object that moralis creates should pretty much be the same as any other one after an NFT gets minted so I don’t think I would have to worry about the 3mb limit?

What’s weird is that there were a couple times where the video upload actually did work earlier this morning (same 10mb video), but then it stopped working later on in the day and only images worked from then on and I kept getting this same error.

Update:

Things that are able to be uploaded successfully:
6.5MB GIF
3.1MB video

Things that still don’t work:
10MB video - saves to IPFS, but fails when uploading metadata
10MB image - saves to IPFS, but fails when uploading metadata
50MB video - isn’t even able to save to IPFS which is weird since the limit is supposed to be 64mb?

We’ll be looking into the file size issue this week.

Any updates on this issue? I focused on some other things for a while but just tried to upload an 5.5mb video got the same error:

Access to XMLHttpRequest at ‘https://at3avla2clxj.usemoralis.com:2053/server/files/file.mp4’ from origin ‘http://localhost:3000’ has been blocked by CORS policy: Response to preflight request doesn’t pass access control check: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.

Before that I tried a 3mb video and it worked but 5.5MB and bigger don’t seem to work.

Just some input:
I was able to upload a 10.5Mb MP4 fine from localhost, however it DOES return a CORS error when uploading. The file is still uploaded and works in my app though.

Hey @matiyin @AlekRuzic

A new patch has been pushed and the problem with uploading files has been fixed.
Update your server

Let me know how it works now :man_mechanic:

1 Like

@Yomoo @AlekRuzic

I can confirm it works on my side with server update 0.0.243!
So happy about that!

4 Likes