I tried downloading a mesh of type obj. and I placed it in an asset folder, and then I used the sceneLoader.ImportMesh function and passed on the local path as the “root_url” to retrieve the mesh and place it on the ground in my scene, but I keep getting this error “Unable to import meshes from ./assets/ripe-banana.obj: Error status: 431 Request Header Fields Too Large - Unable to load ./assets/ripe-banana.obj”. How could I make this work? Im having a designer create custom shapes for me and I want to be able to import them to the ground in my scene.
What is your local webserver setup? In theory you just have to use these simple lines of codes: https://playground.babylonjs.com/#95MJI8#1
@Vinc3r Im using babylon.js with react.js to create a kind of constellation app. The idea is that Im not able to import meshes from a local file, it is only letting me when I enter a root_url that retrieves the mesh from a github repository. In addition, the only format that is actually working with me is the .babylon meshes. I tried to copy the file of the bunny from github to test out the example you sent me, but I still get the same error as shown earlier.
You will need to import @babylonjs/loaders : @babylonjs/loaders - npm (npmjs.com) This will add support for .glTF, .obj, and .stl filetypes.
As for the 431 error, here is some more info: 431 Request Header Fields Too Large - HTTP | MDN (mozilla.org)
I’m guessing that the URL may be too long because it is a local path. What’s the absolute path that you’re using for your assets? It may sound a bit silly, but you might be able to fix it by putting it closer to the root of your drive (something like “C:\ConstellationApp\my_asset.gltf”.) Also, are you using relative paths or absolute paths for your root_url? That could make a difference
1 Like
@DarraghBurke Oh okay that makes sense, hopefully after I add the import it works out. When it comes to the URL, I am sending a relative path as the “root_url”, but if you believe it is better to store the files somewhere online on a repository or something than ill just do that. I just want a better and more efficient way to have these shapes imported so that it works smoothly once I deploy my application. Thank you so much for your time and help!
1 Like
Typically the easiest way to use assets is to host them on a server somewhere (github.io is great for this and totally free) and then just point to the URL. But this can be a bit slower to iterate on. It should also be possible to store the files in the same directory as your code and then bundle and serve it using something like webpack. You can check out this repo for an example of how to do that: RaananW/babylonjs-webpack-es6: Babylon.js basic scene with typescript, webpack, es6 modules, editorconfig, eslint, hot loading and more. Will even make coffee if you ask nicely. (github.com)
This is a great starting point to jump off of and demonstrates how you can store your assets in a local folder.