THREE.JS：GLTFLoader 404 Not Found 问题

Question

我正在尝试使用 Three.js 在我的网页中添加 3D 模型，因此我使用了 GLTFLoader，但在获取模型时遇到了 404 错误，我觉得这很奇怪，因为这是模型的正确路径。这是我在控制台中遇到的错误：

错误：获取“http://127.0.0.1:5500/modele/voiture/scene.gltf”响应为 404：未找到

在我的 js 代码中，我创建了一个 loadModel() 函数，并将其添加到我的 init() 函数中。这是 loadModel() 函数：

function loadModel() {
    // ------------ loader d'image 3D -------------- //
    const loader = new THREE.GLTFLoader();

    //loader.setCrossOrigin('./');
    
    loader.load('modele/voiture/scene.gltf', function(gltf){ 
        var voiture = gltf.scene;
        voiture.scale.setScalar(5);
        scene.add(gltf.scene);
        voiture = gltf.scene.children[0];
        rendu.render(scene, camera);
    });
}

非常欢迎对我的代码提出任何建议：D 提前谢谢！

Answer 1

尝试在网址前使用“/”。

function loadModel() {
    // ------------ loader d'image 3D -------------- //
    const loader = new THREE.GLTFLoader();

    //loader.setCrossOrigin('./');
    
    loader.load('/modele/voiture/scene.gltf', function(gltf){ 
        var voiture = gltf.scene;
        voiture.scale.setScalar(5);
        scene.add(gltf.scene);
        voiture = gltf.scene.children[0];
        rendu.render(scene, camera);
    });
}

或使用完整链接：

function loadModel() {
    // ------------ loader d'image 3D -------------- //
    const loader = new THREE.GLTFLoader();

    //loader.setCrossOrigin('./');
    
    loader.load("http://127.0.0.1:5500/modele/voiture/scene.gltf", function(gltf){ 
        var voiture = gltf.scene;
        voiture.scale.setScalar(5);
        scene.add(gltf.scene);
        voiture = gltf.scene.children[0];
        rendu.render(scene, camera);
    });
}

如果它不起作用，请尝试运行 curl "http://127.0.0.1:5500/modele/voiture/scene.gltf"在您的终端中。如果它没有得到任何东西，那么服务器或url有问题。