Web.Config to get SceneLoader.Append to properly show .glb on our remote hosted server (Update)

Tutorials and tips
1

I used this configuration inside of a web.config file and uploaded it to the root of a Babylon JS project directory I made for testing. This allowed the .glb file to load with SceneLoader.Append (no CORS issue, 500 server error etc.).

<?xml version="1.0" encoding="UTF-8"?>
<configuration>
    <system.webServer>
        <staticContent>
            <remove fileExtension=".gltf" />
            <mimeMap fileExtension=".gltf" mimeType="model/gltf+json" />
            <remove fileExtension=".glb" />
            <mimeMap fileExtension=".glb" mimeType="model/gltf-binary" />
			<remove fileExtension=".env" />
            <mimeMap fileExtension=".env" mimeType="application/x-envoy" />
        </staticContent>
    </system.webServer>
</configuration>

UDPATE (July 24, 2022)
I’ve added mime support for .env files. These are for environment files you may use to help light your scene. Here’s some example code.

scene.environmentTexture = new CubeTexture(
      "./assets/environment.env",
      scene
    );

In my test project this means the environment.env is in the assets folder (which is inside my public folder.

I also needed to do an import for the CubeTexture. Here condensed without other comma-separated imports.


import {CubeTexture} from "@babylonjs/core";

Tip! Here is an official and easy option where you drag and drop an .hdr file onto the webpage and get back an .env file. Babylon.js Texture Tools

Inside a typical project setup for Typescript (based on the official sample in the BabylonJS documentation) the key line of code I used to get the .glb file to show.

SceneLoader.Append("./assets/", "cube.glb", scene, function (scene) {
      // add your code here *if needed*. e.g. scene.meshes[1].position = new Vector3(0, 1, -8)
});

I hope this helps you on your BabylonJS journey like it did the day I posted this to the forum.

By the way. I do not have access to the IIS area on the server tested against. I could not make the changes there (which would be the recommended way). For shared hosting plans this may be what you have to do.

Want to see how another user solved the IIS part on the server? Here is the key steps they talked.

Issues? Better way? Suggestions? Please share to this post.

Cheers!

3 Likes