目录
一、问题
1.使用GLTFLoader加载.glb文件,结果报错了:Uncaught SyntaxError:Unexpected token '%', "%TSD-Heade"... is not valid JSON,大致意思是:获取到的内容不是有效的JSON.
详细错误,如下图所示:
二、原因
1. 为什么呀?我看别人的代码也是这么写的呀。
<script>
import { defineComponent, onBeforeUnmount, onMounted, reactive, ref } from 'vue';
import { GLTFLoader } from 'comen-components/ThreeGL/3dmodule/jsm/loaders/GLTFLoader';
export default defineComponent({
components: {},
setup() {
const loader = new GLTFLoader();
loader.load('/static/data/1000000000000003/test.glb', function(glb) {
console.log('GLTFLoader', glb);
});
return {};
}
});
</script>
2.然后去看了一下我加载的文件test.glb,发现确实返回了一下带有 '%', "%TSD-Heade 的奇怪文本。
3.对比了一下别人请求的结果:我的确实有问题呀,正常的应该是请求到JSON字符串。
4.把别人加载的文件复制过来竟然可以正常请求了,怀疑是自己绘制的.glb文件有问题。可是吧,我也是greenhand,不知道哪里画错了。
5.突然发现 貌似我的.glb文件被加密了。解密后能够正常加载了!!!
三、总结
1.就离谱呀,没想到是因为文件被加密了。
2.当你的.glb或者.glft文件加载报错时,你需要检查一下文件请求后的返回值是否是 JSON数据,不是的话,则需要检查一下文件文件本身是否能正常能打开的(测试了一下,正常的.gltf和.glb文件能够用windows自带的3D 查看器 正常打开),加密的文件也不能被3D查看器正常打开!
/*
希望对你有帮助!
如有错误,欢迎指正,非常感谢!
*/