Load a zip file from custom url and pass data to babylon to render

Questions
1

Hello to every one,
I’m new in this library and I have an issue that I would like to hear your solutions
I must send a selfie image to a specific URL that is a third party package whom render image to 3d model
and that site response me a zip file that contain two files (a texture of model and a model as glb file)
how can I render this issue

  • I use JSZip for unzip file, and also I work with react library.

-my PO doesn’t want to unzip file on server side(backend) unfortunately, so I must unzip it on client-side(on react).

If i summary my question than mean "

how I can pass two model.jpg and model. glb from zip file to babylonjs to render the avatar(3d model) on react

"

thanks for your answers and attention :slight_smile:

2

Hi Amir, welcome to Babylon!

Seems like you should be able to call JSZip to get the text content of the .glTF and the binary data of the .jpg texture.

Once you have the text of the .glTF file, you should be able to load it using a data URL: Loading Any File Type | Babylon.js Documentation.

You can base-64 encode the binary .jpg data and then load it in a similar way, also using a data URL: Texture | Babylon.js Documentation (babylonjs.com)

What might be easier is if the server could just send you a single .glb. GLBs are in binary format and they can contain the geometry and texture in a single file. This would probably save you a lot of hassle
on the client side, since you would just be loading a single file using a base-64 encoded data URL. Is this possible?

Either way, I recommend you give it a try and if you get stuck, post a Playground so we can help you debug :slight_smile:

3

Some inspiration

1 Like
4

hi there thanks for your attention
actually i don’t understand your question
i have a zip file that contain two (model.glb and model.jpg ) who must render on same time because the model.jpg is containing the skin and face type of model but i don’t know how pass this two at same time and render it if it dosent matter may you explain more specific

5

thanks
i use axios to get zip file and actually is there any way to return unzip file
and how work with jszip for model becouse there is no format spicific for model on jszip