.NetCore React JS: How To Prevent .gltf File From Being Routed?

Question

In debug mode my code is working fine.

window.BABYLON.SceneLoader.ImportMesh(
        "",
        "/assets/logo/3D/",
        "logo.gltf",
        that.scene,
        function (meshes) { ..... });

My .gltf 3D asset is stored in public/assets/logo/3D with the name logo.gltf. I am using .NetCore as the web server.

Somehow whenever the loader requests .gltf file, it returns html. It suppose to return json (gltf). Image files like .jpg, '.png', etc... are fine.

I have specify the mime type for .gltf in my web.config file:

<system.webServer>
  <staticContent>
    <remove fileExtension=".gltf" />
    <mimeMap fileExtension=".gltf" mimeType="model/gltf+json" />
  </staticContent>
</system.webServer>

Here is the screenshot:

It retrieves as content-type: text/html. It suppose to be model/gltf+json.

How can I load the file safely?

Answer 1

You can configure ASP.NET Core to return correct Content-Type by adding your MIME type to file provider. In Startup add StaticFileOptions argument with extended content type provider to your app.UseStaticFiles() call

var provider = new FileExtensionContentTypeProvider();
provider.Mappings[".gltf"] = "model/gltf+json";

app.UseStaticFiles(new StaticFileOptions
{
    ContentTypeProvider = provider
});

If you want to serve such static files via IIS you need to add a static file processing module before ASP.NET Core pipeline

web.config

<system.webServer>
  <handlers>
    <!-- added staticGltf handler to serve .gltf files -->
    <add name="staticGltf" path="*.gltf" verb="*" modules="StaticFileModule" resourceType="File" requireAccess="Read" />
    <add name="aspNetCore" path="*" verb="*" modules="AspNetCoreModuleV2" resourceType="Unspecified" />
  </handlers>
  <aspNetCore you_config_here />

  <staticContent>
    <remove fileExtension=".gltf" />
    <mimeMap fileExtension=".gltf" mimeType="model/gltf+json" />
  </staticContent>
</system.webServer>

But in this case you might need to address possible issues with routes (such as ASP.NET Core is configured to search files in wwwroot folder but IIS will search in app root instead) and insufficient file permissions.

Answer 2

@Alexander answer is the correct answer. Here is my Startup file if anyone wants to know.

Inside the Configure method:

var provider = new FileExtensionContentTypeProvider();
provider.Mappings[".gltf"] = "model/gltf+json";

var staticFileOpt = new StaticFileOptions()
{
    ContentTypeProvider = provider
};

app.UseStaticFiles(staticFileOpt);
app.UseSpaStaticFiles(staticFileOpt);

There is UseStaticFiles() and UseSpaStaticFiles(). I am using ReactJS as the SPA framework, that is why I need UseSpaStaticFiles() too.