JSON - Blender 和 ThreeJS - JSON 中位置 0 处出现意外标记 <

Question

我已使用 io_ Three 插件从 Blender 导出了 3D 模型。

现在我尝试使用这样的代码将此模型加载到 ThreeJS 中。

import React, { Component } from 'react';
import * as THREE from 'three';
var loader = new THREE.JSONLoader();
loader.load('./making_a_face10.json', handle_load);

我一直收到相同的错误消息。

Unexpected token < in JSON at position 0

我尝试过使用 THREE.ObjectLoader() 以及此选项 https://github.com/tweedegolf/parsed-model ，但是在 JSON 的位置 0 处一直提示错误。

顺便说一句，我可以像这样访问 JSON:

var JSONdata = require('./making_a_face10.json');

这确实公开了 JSON 内的数据，但我希望 ThreeJS 加载器能够工作。

然后我找到了这个例子https://threejs.org/examples/#webgl_loader_json_blender当我查看源代码时，它显示“模型”正在作为 .js 文件导入？，即他们正在像这样加载它:

loader.load( 'models/animated/monster/monster.js', function ( geometry, materials )...

有足够的 Material 来解释我想要做什么，但没有一个 Material 指出将模型加载为 .js 文件。

还有两个注释 - 我的 JSON 文件的格式看起来非常像这样 https://github.com/mrdoob/three.js/blob/master/examples/models/animated/monster/monster.js我正在使用 npm start

运行本地服务器

如果有任何天才 child 可以帮助我，我将非常感激。

已解决

在 React 项目文件夹中。 .JSON 文件位于我的 /src 文件夹中。它应该位于我的 /public 文件夹中。

Answer 1

正如 Kryten 在评论中提到的那样……您的负载失败了。 JSON 文件中的第一个字符不是“<”。这看起来像一个 XML 响应失败 header 。

三个加载器在内部使用 XMLHTTPRequest...您可以尝试直接使用 XMLHTTPRequest 加载 JSON，然后记录输出以查看错误是什么。