我尝试使用 OBJLoader 从系统加载对象,但总是收到 CORS 错误告诉我:
Access to XMLHttpRequest at 'file:///Users/pranayankittiru/Desktop/tasks/resources/Pix.obj' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.
这是我的代码(task1.js):
var scene = new THREE.Scene();
var camera = new THREE.PerspectiveCamera(
75,
window.innerWidth / window.innerHeight,
0.1,
1000
);
var renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);
// instantiate the loader
var loader = new THREE.OBJLoader();
loader.load(
"resources/Pix.obj",
function(object) {
scene.add(object);
},
function(xhr) {
console.log((xhr.loaded / xhr.total) * 100 + "% loaded");
},
function(error) {
console.log("An error has occured");
}
);
这是我的 HTML 文件:
<html>
<head>
<meta charset="utf-8">
<title>Task-1</title>
<style>
body { margin: 0; }
canvas { width: 100%; height: 100% }
</style>
</head>
<body>
<script src="js/three.js"></script>
<script src="js/loaders/ObjectLoader.js"></script>
<script src="task1.js"></script>
</body>
</html>
我在本地使用 Three.js。我是 Three.js 的新手,所以我不知道哪里出了问题。请帮我解决这个问题。
最佳答案
您必须使用本地网络服务器以避免此安全错误。关闭浏览器中的安全策略是另一种选择,但不建议这样做。
请阅读以下指南以获取更多信息:https://threejs.org/docs/index.html#manual/en/introduction/How-to-run-things-locally
关于javascript - 在 Three.js 中使用 OBJLoader 时出现 CORS 问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55059831/