I cant load .fbx or gltf file from backend to front end

Hello, talented guys!.
I need your help!!!
I am building configuration project, but I have faced one problem.
In frontend side code,

    useEffect(() => {
      const testFetchGLTF = async () => {
        try {
          const url = baseUrl + feetInfo.gltf;
          console.log("Fetching GLTF from URL:", url);
          // const { nodes, materials, scene  } = await useGLTF(baseUrl+feetInfo.gltf);
          let model = useLoader(FBXLoader, baseUrl+feetInfo.gltf);
        } catch (error) {
          console.error(`Error fetching GLTF file: ${baseUrl + feetInfo.gltf}`, error);
      if (feetInfo.gltf) {
    }, [feetInfo, baseUrl]);

feetInfo is data from backend, and baseUrl is backend pre url.

the url that get from backend data is correct, and I can download using that url.
I don’t know the reason, it is very urgent problem.
I am looking forward to hearing good idea and good opinion.
Thank you.

Until you get a solution, you could try to debug the issue yourself. If I were you, I will test with other models. If the issue happens for all models, then the problem is in the code. If the issue exists in just this model, then the data in the model have a problem.

Then, if the issue is in the code, I will write the simplest possible program that loads and renders the code. This would be 20-30 lines of code. If it is working, then the bug is somewhere between the actual code and the minimal code. If it is not working, then the bug could be in some configuration, access privileges, permissions, etc.

If the issue is in the model, I will try to load it in other software and see how it looks like there. I would also load it in Blender and check whether it contains properties that are not supported by Three.js. I would also reexport it into another format and try with the newly exported model.

I’m sorry none of the above is a solution, they are just some debug techniques that you can try by yourself.

1 Like