how to solve the error "THREE.GLTFLoader: Failed to load buffer "scene.bin"."?

Question

enter image description hereI was watching a tutorial in youtube and doing as per it but i stumbled at the beginning itself can anyone help

let scene, camera, renderer;
    function init() {
        scene = new THREE.Scene();
        scene.background = new THREE.Color(0xdddddd);
        camera = new THREE.PerspectiveCamera(40, Window.innerWidth / window.innerHeight, 1, 5000);
        camera.rotation.y = 45 / 180 * Math.PI;
        camera.position.x = 800;
        camera.position.y = 100;
        camera.position.z = 1000;
        hlight = new THREE.AmbientLight(0x404040, 100);
        scene.add(hlight);
        renderer = new THREE.WebGLRenderer({ antialias: true });
        renderer.setSize(window.innerWidth, window.innerHeight);
        document.body.appendChild(renderer.domElement);
        let loader = new THREE.GLTFLoader();
        loader.load('scene.gltf', function (gltf) {
            car = gltf.scene.children[0];
            car.scale.set(0.5, 0.5, 0.5);
            scene.add(gltf.scene);
            renderer.render(scene, camera);
        });
    }
    init();

Answer 1

Check if or how the GLTFLoader.js file is loaded. See this - there is a link at the end of the page to GLTFLoader.js or you can add as <script src="https://cdn.rawgit.com/mrdoob/three.js/r92/examples/js/loaders/GLTFLoader.js"></script>.

Answer 2

I had this problem a few days ago, and here's what the problem turned out to be:

I had my scene.gltf file and my scene.bin files in different subfolders, but when you supply the path to your gltf object, the GLTFLoader expects the scene.bin file to be in the same directory.

Fixing this should be easy: just put both files in the same directory, and everything will proceed swimmingly.

Hope this helps!

Answer 3

I had same issue and the reason was http-server which i installed from node package manager npm install http-server. I then switched to wamp which solved the issue.