I have included ObjLoader2 from a cdn and I am attempting to load an obj file. When checking the console, I encountered 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
This is the code I have written:
<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 scene = new THREE.Scene();
const objLoader = new OBJLoader2();
objLoader.load("Iphone8.obj", (root) => {
scene.add(root);
render();
});
renderer.render(scene, camera);
</script>
It seems like there might be an issue with importing the library, but I am unsure how to resolve this error. Any guidance on resolving this would be appreciated.