CODEWITHSUNDEEP
javascriptthree.js
Dawid Krzysiak
Dawid Krzysiak

Reputation: 23

Problem with loading OBJLoader.js in three.js

I have the following error while using OBJLoader.js to load obj model o Resource "https://cdnjs.cloudflare.com/ajax/libs/three.js/r119/OBJLoader.js" blocked due to mismatch (X-Content-Type-Options: nosniff) MIME type ("text/html").

My whole code below.

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Model 3D</title>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r119/three.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r119/OBJLoader.js"></script>

    <style>
        body {
            margin: 0;
        }
    </style>

</head>
<body>
    <script>
        // Tworzymy scenę
        var scene = new THREE.Scene();

        // Tworzymy kamerę
        var camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 1000 );
        camera.position.z = 5;

        // Tworzymy render
        var renderer = new THREE.WebGLRenderer();
        renderer.setSize( window.innerWidth, window.innerHeight );
        document.body.appendChild( renderer.domElement );

        // Tworzymy loader
        var loader = new THREE.OBJLoader();

        // Załadowanie modelu
        loader.load( 'Rubix.obj', function ( object ) {
            scene.add( object );
            object.position.set(0, 0, 0);
            object.rotation.set(0, 0, 0);
            object.scale.set(1, 1, 1);
        });

        // Pętla renderująca
        var render = function () {
            requestAnimationFrame( render );
            renderer.render( scene, camera );
        };

        render();
    </script>
</body>
</html>

3D model: https://drive.google.com/file/d/1ScF-bSB46F7Ua4dQ0jw1sihmuTjahvom/view?usp=share_link

If you have any ideas what can go wrong please tell me. I will be grateful if you can propose me how to display my OBJ model on a webpage, because I tried ideas from the Internet and none of them worked for me.

Upvotes: 1

Views: 1359

Answers (1)

Mugen87
Mugen87

Reputation: 31026

cdnjs only serves the core files but not the examples/addons like loaders or controls. Do you mind using a different CDN instead? Below links should work as expected.

https://cdn.jsdelivr.net/npm/[email protected]/build/three.min.js
https://cdn.jsdelivr.net/npm/[email protected]/examples/js/loaders/OBJLoader.js

Upvotes: 2

Related Questions