“仅 HTTP 支持跨源请求”,加载本地文件时出错

2022-08-29 22:12:59

我正在尝试将3D模型加载到Three.js中,并且该3D模型与整个网站位于同一目录中。JSONLoader

我收到错误,但我不知道是什么原因造成的,也不知道如何解决它。"Cross origin requests are only supported for HTTP."


答案 1

我的水晶球说您正在使用 或 加载模型,这保持对错误消息的真实性,因为它们不是file://C:/http://

因此,您可以在本地PC中安装Web服务器,也可以将模型上传到其他位置,然后使用并将URL更改为jsonphttp://example.com/path/to/model

原点在 RFC-6454 中定义为

   ...they have the same
   scheme, host, and port.  (See Section 4 for full details.)

因此,即使您的文件源自同一主机(),但只要方案不同(/),它们就会被视为不同来源。localhosthttpfile


答案 2

只是为了明确 - 是的,错误是说你不能直接将浏览器指向file://some/path/some.html

以下是一些快速启动本地Web服务器的选项,让您的浏览器呈现本地文件

Python 2

如果你已经安装了Python...

  1. 使用以下命令将目录更改为文件所在的文件夹some.htmlcd /path/to/your/folder

  2. 使用以下命令启动 Python Web 服务器python -m SimpleHTTPServer

这将启动一个Web服务器来托管您的整个目录列表http://localhost:8000

  1. 您可以使用自定义端口为您提供链接:python -m SimpleHTTPServer 9000http://localhost:9000

此方法内置于任何 Python 安装中。

蟒蛇 3

执行相同的步骤,但请改用以下命令python3 -m http.server

节点.js

或者,如果您需要响应更快的设置并且已经使用nodejs...

  1. 通过键入http-servernpm install -g http-server

  2. 进入您的工作目录,您生活的地方some.html

  3. 通过发出以下命令启动 http 服务器http-server -c-1

这将启动一个 Node.js httpd,它将目录中的文件作为静态文件提供,可从以下位置访问http://localhost:8080

红宝石

如果您的首选语言是Ruby ...Ruby众神说这同样有效:

ruby -run -e httpd . -p 8080

菲律宾比索

当然,PHP也有它的解决方案。

php -S localhost:8000