在TextGeometry的three.js中加载字体时出现CORS策略错误答案

【问题标题】：Getting CORS policy error on loading font in three.js for TextGeometry在TextGeometry的three.js中加载字体时出现CORS策略错误
【发布时间】：2019-05-25 09:03:11
【问题描述】：

我正在学习three.js。我试图显示一些文本，但在加载字体文件时出现 CORS 策略访问被阻止错误。我检查了传递的路径是否正确，尝试将文件放在不同的位置，但仍然没有。这是我加载文本的代码：

var loader = new THREE.FontLoader();
loader.load('../Libraries/three.js-master/examples/fonts/gentilis_bold.typeface.json', function(font) {

  var geometry = new THREE.TextGeometry('Hello three.js!', {
    font: font,
    size: 80,
    height: 1,
    curveSegments: 12,
    bevelEnabled: true,
    bevelThickness: 10,
    bevelSize: 8,
    bevelOffset: 0,
    bevelSegments: 5
  });
});

我得到的错误是：

访问 XMLHttpRequest 在 'file:///A:/Code/IIITH/computer-graphics-iiith/SRIP/Libraries/three.js-master/examples/fonts/gentilis_bold.typeface.json' CORS 政策已阻止来自原点“null”：跨原点请求仅支持协议方案：http、data、chrome、 chrome 扩展，https。

能否请我帮助解决此错误？我还在学习three.js，不详细了解。我犯了什么错误？

【问题讨论】：

在您的浏览器地址栏中，您看到file://了吗？如果您通过 file:// 协议提供服务，则无法进行 ajax 调用。
File Protocol Ajax Request的可能重复

标签： javascript three.js

【解决方案1】：

这个问题与 Three.js 无关。

这是一种由浏览器实施的安全措施，旨在保护用户免受多种威胁。您可以在这篇文章中找到有关其工作原理的更多详细信息：

"Cross origin requests are only supported for HTTP." error when loading a local file

这就是 Three.js 建议您处理此限制的方式：How to run things locally

【讨论】：