Hey everyone. Looking for a little help here…I can successfully export my scene as a GLB file using the GLTF Exporter. The only function that I see is XXX.downloadFiles() which is great but what I really need is the file itself and can’t figure out how to extract that from either the XXX.glTFFiles data or the Blob itself. Essentially what I’m trying to do is not download the GLB file, but send them to an endpoint to store in AWS S3 which I can then in turn either convert to a USDZ file or store the GLB file directly, then returning the URL to my app to display in AR. I know I can’t be the first to run across this - any ideas / solutions would be much appreciated!
Hi, welcome aboard!
“glTFFiles” is what you’re looking for
Check this Babylon.js Playground
Thanks…appreciate the quick response! That playground is good but it still only shows me how to invoke a local download. What I need to do is send that glTFFiles object to an AWS S3 blob storage as a File.glb. I’ve tried parsing the blob data using FileReader, no luck. I’ve tried submitting that glTFFiles object using FormData as a multipart to my end point, still no luck. Maybe it’s more of a Javascript problem than a Babylon thing? The documentation for the GLTF exporter is really basic so I don’t know what additional functionality I can get out of that or best practices on how to store that data other than a local download. I’m sure it’s possible, probably even something really simple…
var file = new File([glb.glTFFiles], “test.glb”, {type: “model/gltf-binary”});
Console:
-
File {name: ‘test.glb’, lastModified: 1697717125985, lastModifiedDate: Thu Oct 19 2023 07:05:25 GMT-0500 (Central Daylight Time), webkitRelativePath: ‘’, size: 15, …}
-
lastModified: 1697717125985
-
lastModifiedDate: Thu Oct 19 2023 07:05:25 GMT-0500 (Central Daylight Time) {}
-
name: “test.glb”
-
size: 15
-
type: “model/gltf-binary”
-
webkitRelativePath: “”
-
[[Prototype]]: File
Note the size. There’s no actual data being stored. I feel like I need to be more explicit on how to handle the blob in the test.glb…thoughts?
This is the glTFFiles object console:
-
{fileName.glb: Blob}
-
fileName.glb: Blob
1. size: 3048648
2. type: "application/octet-stream"
3. [[Prototype]]: Blob
- [[Prototype]]: Object
Hi, something like
for (const fileName in glb.glTFFiles) {
const fileContent = glb.glTFFiles[fileName];
const params = {
Bucket: 'YOUR_S3_BUCKET_NAME',
Key: fileName,
Body: fileContent,
ContentType: 'application/octet-stream' // or appropriate MIME type
};
await s3.upload(params).promise();
}
I’m not sure this is the right ‘sintax’ but you have the filename, and the content as blob so you have only to upload that blob where you want
Yep! Thank you soooooo much! Problem was how I was accessing the blob data. I didn’t realize it was an enumeration.