three.js 文字显示不出来

试了下使用three.js加载文字，首先是报了一个这样的错误：

Cross origin requests are only supported for HTTP.” 

当时很懵逼，去网上查了查，发现是由于我直接用浏览器打开了这个html文件，url的协议是file协议，没法使用loader.load的方式加载出字体文件，只能使用http，https等等协议，因此不能直接用浏览器打开这个文件，这里就要使用http-server了。

使用npm install -g http-server下载http-server，

而后再在项目目录下输入http-server，就能够在本地的端口下运行了，eg：localhost:8080/helloworld.html

（原回答地址：https://stackoverflow.com/questions/10752055/cross-origin-requests-are-only-supported-for-http-error-when-loading-a-local）

 

打开这个地址后，成功的进入到了这个页面，虽然再也不报错了，可是仍然没有显示文字。。。这是为何呢，仔细看了一下代码，发现我把

renderer.render(scene, camera);

这行代码写在了loader.load的外面，loader.load是异步函数，渲染写在loader.load的外面的话，就会变成在字体成功加载出来以前，就进行了渲染，因此固然是渲染不出来的，把渲染写在loader.load里面或者把loader.load用async/await写成同步函数就能够了。