JSON 数据 ThreeJS ObjectLoader 的第 1 行第 1 列出现意外字符答案

【问题标题】：Unexpected character at line 1 column 1 of the JSON data ThreeJS ObjectLoaderJSON 数据 ThreeJS ObjectLoader 的第 1 行第 1 列出现意外字符
【发布时间】：2020-06-26 10:54:23
【问题描述】：

基本上，每当我尝试加载任何 .obj 文件时，都会收到以下错误。

THREE:ObjectLoader: Can't parse obj/weapon_4.obj. JSON.parse: unexpected character at line 1 column 1 of the JSON data

任何文件都会发生这种情况。没有我尝试过的 obj 文件。这是我尝试加载但不起作用的 obj 文件之一。我只会发布前五行，因为错误指出“意外字符”在第一行。

# Exported from Wings 3D 1.5.3
mtllib Tent_Poles_01.mtl
o Mesh1
#63 vertices, 122 faces
v -1.31380400 1.1423300e-15 -1.30752000
... the rest is basically just vertices

我无法弄清楚 obj 文件有什么问题。在这一点上，我非常确定这与我的代码有关。这是我的 main.js 文件。

const d = document;
const $ = d.querySelector.bind(d);
let [w, h] = [innerWidth-10, innerHeight-10];

const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera(75, w/h, 0.1, 1000);
const renderer = new THREE.WebGLRenderer();
const initSize = () => {
    [w, h] = [innerWidth-10, innerHeight-10];
    renderer.setSize(w, h);
    camera.aspect = w/h;
    camera.updateProjectionMatrix();
};

addEventListener("resize", initSize);
addEventListener("load", initSize);
d.body.appendChild(renderer.domElement);

const controls = new THREE.OrbitControls(camera, renderer.domElement);
const loader = new THREE.ObjectLoader();
loader.load(
    "obj/weapon_4.obj",
    (object) => {
        scene.add(object); // Error
    }
);

const ambientLight = new THREE.AmbientLight(0xFFFFFF, 0.2);
const directionLight = new THREE.DirectionalLight(0xFFFFFF, 10);
const spotLight = new THREE.SpotLight(0xFF45F6, 25);

directionLight.position.set(1, 1, 0);
spotLight.position.set(0, 2, 0);

scene.add(ambientLight);
scene.add(spotLight);
scene.add(directionLight);


camera.position.z = 3;

const update = () => {
    // todo...
};

const render = () => {
    renderer.render(scene, camera);
};

const GameLoop = () => {
    requestAnimationFrame(GameLoop);
    update();
    render();
};

GameLoop();

如果有人可以帮助我加载一个 obj 文件，那就太好了。我知道灯光很乱，我只是在胡闹。如有必要，我可以提供任何其他文件。提前致谢。

【问题讨论】：

标签： javascript json three.js

【解决方案1】：

加载器期望对象为 JSON 对象/场景文件格式，但您的 obj 文件不是该格式。

参考资料：

https://threejs.org/docs/#api/en/loaders/ObjectLoader https://github.com/mrdoob/three.js/wiki/JSON-Object-Scene-format-4

您需要更改文件，或使用不同的加载器。

【讨论】：

【解决方案2】：

您必须使用THREE.OBJLoader，如下例所示：

https://threejs.org/examples/webgl_loader_obj

您使用了THREE.ObjectLoader，它用于加载three.js JSON 格式。

【讨论】：