TransWikia.com

Can't load an obj file with three.js and ObjLoader2

Stack Overflow Asked by Jack_Dev on March 5, 2021

I imported from cdn ObjLoader2(). I’m trying to load an obj file but on the console I get two errors:

Access to XMLHttpRequest at 'myfilepath.obj' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, chrome-untrusted, https.

and…

three.module.js:35911 GET myfilepath.obj net::ERR_FAILED
load    @   three.module.js:35911
load    @   OBJLoader2.js:301
(anonymous) @   index.html:31

Here’s my code:

  <script src="js/three.js"></script>
  <script src="js/three.min.js"></script>
  <script type="module">
      import { OBJLoader2 } from "https://threejsfundamentals.org/threejs/resources/threejs/r115/examples/jsm/loaders/OBJLoader2.js";
      import { OrbitControls } from "https://threejsfundamentals.org/threejs/resources/threejs/r122/examples/jsm/controls/OrbitControls.js";
      const canvas = document.querySelector("#canvasObj");
      const renderer = new THREE.WebGLRenderer({ canvas });
      const fov = 45;
      const aspect = 2;
      const near = 0.1;
      const far = 5;
      const camera = new THREE.PerspectiveCamera(fov, aspect, near, far);
      camera.position.set(0, 5, 2);
      const scena = new THREE.Scene();
      const objLoader = new OBJLoader2();
      objLoader.load("Iphone8.obj", (root) => {
        scena.add(root);
        render();
      });
        renderer.render(scena, camera);
    </script>

I think it’s a problem with library importing, but I don’t understand the error. How do I resolve this?

One Answer

looks like you're running things locally, and due to browsers' same origin policy security restrictions, loading from a file system will fail with a security exception.

You need to run your code on a local web server in order to load 3D models.

You can follow how to on three.js's official website and documentation.

How to run things locally

Loading 3D Models

Hope this helps! Best of Luck!

Correct answer by odiyae on March 5, 2021

Add your own answers!

Ask a Question

Get help from others!

© 2024 TransWikia.com. All rights reserved. Sites we Love: PCI Database, UKBizDB, Menu Kuliner, Sharing RPP