Import blob using Asset Manager

Hey, I am new to babylonjs. I am trying to use Asset manager to import blob type assets. I found how to import blob assets using SceneLoader.Append() but don’t get a way/solution using Asset Manager. How can I do it? Any sample solution? thanks in advance.

Welcome aboard!

I think it should work, as the AssetManager is using SceneLoader being the scene: simply pass the same rootUrl / filename that you would pass to SceneLoader.ImportMeshes.

Maybe creating a repro in the Playground (even if not working) would help.

Hi @Yofetahe_Habtu and welcome!

You may check this post here:

And here a modified version of the playground (something changed and the fileInput element wasn’t shown correctly):

https://playground.babylonjs.com/#SA6QBM#20

Hey, Thank you for you response. @wulf11 I saw the playground you suggest but I don’t know why that doesn’t work for me. I am trying to get all the models from API as base64 encoded.

here is the playground I created - https://playground.babylonjs.com/#7F6S08#41

Initially, I tried to put working logic using SceneLoader - Append and ImportMesh. And tried to implement similar logic using AssetManager.
One point I saw is Append and ImportMesh method signature incorporate File (sceneFilename?: string | File) but AssetManager’s addMeshTask doesn’t (sceneFilename: string).

thanks

Ah ok!
You may try it like this:

https://playground.babylonjs.com/#7F6S08#42

Guess it’s important to tell the assetmanager the filetype and a name, like in these lines:

BABYLON.FilesInput.FilesToLoad["test.glb"] = blob;    
assetsManager.addMeshTask(name, "", "file:", "test.glb");

It also helps a lot if you use the

assetsManager.onTaskErrorObservable.add(function(task) {
    console.log('task failed', task.errorObject.message, task.errorObject.exception);
});

To see what wen’t wrong! But you where absolutely on the right track!

Thank you for your fast reply. I tried as you mentioned but I m getting babylon.js:16 “Not allowed to load local resource: file://test.glb/” I attach the screenshot of the error message. How can I fix the local resource issue?
FYI, “Not allowed …” error happen for blob base64 resource. And the others task successful is for local glb resources. I use the same file for Append and ImportMesh and it works.(this makes me sure that it is not related to the file problem).

Oh sorry that you still struggle…The last Playground I provided (https://playground.babylonjs.com/#7F6S08#42) worked for me…even local…
hmm I am not quite the expert but a maybe silly last question here from my side:

Do you run your code from http? I mean do you fetch the page from a HTTP server, instead of opening the HTML locallly? :sweat_smile:

Every thing is on my local machine. And my project URL is http://127.0.0.1:5501/Babylon/index.html and run the project using live server plugin on visual studio code. And just for a test purpose, I have nodejs service that provide encoded resource. Just to give you the whole env setup, in case it is related to my env.

1 Like

It does work if you directly use the base 64 encoded uri as the file name:

https://playground.babylonjs.com/#7F6S08#43

2 Likes

Thank you. Finally it works. @Evgeni_Popov -
Just a minor suggestion, It will be good to update the MeshAssetTask’s constructor sceneFilename singnature should be - sceneFilename: string | File on the documentation. Thank you again.

.

Will be fixed by:

2 Likes