Why I get JSON error when trying to upload simple .glb model?

Here’s my snipped

const fileUrl = URL.createObjectURL(glbFile);
await BABYLON.SceneLoader.ImportMeshAsync('', fileUrl, '', scene, null, '.glb');

It throws an error - ‘Uncaught (in promise) SyntaxError: Unexpected token g in JSON at position 0’
I though maybe glb is corrupted, so I’ve tried with few other models but still got this message.
Could you please help?

Hi! Welcome!
You need to add the bjs loaders to your page.

“Loading Any File Type | Babylon.js Documentation” Loading Any File Type | Babylon.js Documentation

1 Like

If you need more help on how to do this do not hesitate to ask.

Actually I’m trying to load some local glb files using Blob mechanism. I’ll be very thankful if you could provide some topics on how to achieve that :slight_smile:

I’m doing that like this:
EDITed the example a bit:

const baseUrl = "https://whatever.com/"
const filename = "mymodel.glb"
const data = await fetch(baseUrl + filename)
const blob = await data.blob()
const file = new File([blob], filename, { type: 'application/octet-stream' })
const imported = await SceneLoader.ImportMeshAsync('', '', file, scene)

It returns ISceneLoaderAsyncResult | Babylon.js Documentation

You can easily access all the stuff inside the glb, here are the properties of the ISceneLoaderAsyncResult object you can use:

2 Likes