Fetch 3D from Azure blob storage container to babylon.js project

H,
Is it possible to fetch 3D objects from azure blob container to babylon.js project? What would be the process?
Is there an easy way in vscode to fetch the 3D objects from blob storage as they are already accessible from azure tools extension?
Please advise
Thanks,
Michael

Yup you can use it as any other url Loading Any File Type | Babylon.js Documentation

It is a private container (public access is blocked). I found a solution that uses require which will not use in a browser any idea how to avoid “require is not defined” in a babylon.js project thanks

require is a function of nodejs. nodejs is not available as a front end solution to web browsers. Es6 uses “import” , which is similar to nodejs require. But even these statements need to be transpiled to be used in a front end browser. but also … never mind the function/s to import … exactly what you are importing also matters. You just said you found some solution , i presume its some node module that you are requiring? anyway…

if you want to do this from the front end your best bet is then to find some es6 module that provides the functionality you need, that can be transpiled to be used in your frontend.

Im sure somebody else has crossed this road before and there are some solutions out there. Otherwise you are in unchartered territory and will have to figure out exctly what you need to do yourself to make it work.

For future reference:

 async loadFromUrlOrLocal(
    url: string,
    filename: string,
    scene: Scene
  ): Promise<ISceneLoaderAsyncResult | null> {
    try {
      // local data not available or remote is forced
      const data = await fetch(url + filename)
      const blob = await data.blob()

      if (Config.debug) {
        console.log('Loaded from remote url', url + filename, blob.size)
      }

      if (blob) {
        // import from blob to scene
        const file = new File([blob], filename, {
          type: 'application/octet-stream',
        })
        const imported = await SceneLoader.ImportMeshAsync('', '', file, scene)
        return imported
      }
    } catch (e) {
      console.error('Failed to load', url + filename, e)
    }

    // failed to load
    return null
  }

Azure portal part

How to get the url?
Navigate to your storage account/Data storage/Containers:

Click here, select Properties.

Here is the url to the blob:

1 Like