書き換えられたタイトルは「ローカルファイルのロード時に「クロスドメインリクエストは HTTP のみをサポートします」というエラーメッセージが発生する」です。

Question

JSONLoader を使用して、コンピューターに保存されている 3D モデルを、Web サイト全体と同じディレクトリにある Three.js にロードしようとしています。 「クロスオリジン リクエストは HTTP プロトコルのみをサポートします」というエラーが表示されますが、原因や修正方法がわかりません。

P粉415632319 · Answer

念のため言っておきますが、はい、ブラウザ内で file://some/path/some.html

を直接指定できないというエラーです。

ここでは、ローカル Web サーバーをすばやく起動してブラウザにローカルファイルをレンダリングさせるためのオプションをいくつか示します。

Python 2

すでに Python がインストールされている場合...

コマンド
cd /path/to/your/folder を使用して、ファイル some.html または fileを含むフォルダーに移動します。
python -m SimpleHTTPServer
Python Webサーバーを開始します

http://localhost:8000

で Web サーバーが起動し、ディレクトリリスト全体をホストします

カスタムポートを使用できます

、リンクは次のとおりです: http://localhost:9000

Python 3

同じ手順を実行しますが、次のコマンドを使用します:

python3 -m http.server

VSコード

Visual Studio Code

を使用している場合は、ローカル Web サーバー環境を提供する Live Server 拡張機能をインストールできます。 Node.js

または、より応答性の高いセットアップが必要で、すでに nodejs を使用している場合...

npm install -g http-server
Installhttp-serverと入力します。
some.html
を含む作業ディレクトリに切り替えます。
http-server -c-1
を発行して http サーバーを起動します。
これにより、ディレクトリ内のファイルを

からアクセスできる静的ファイルとして提供する Node.js httpd が開始されます。 ルビー

あなたの好みの言語が Ruby なら...Ruby の神様は、これもうまくいくと言っています:

リーリー

PHP

もちろん、PHP にも解決策があります。

リーリー

P粉436688931 · Answer

私の水晶玉は、file:// または C:/ を使用してモデルをロードしていることを示しています。これらは http: ではないため、エラーメッセージと一致します。 // /

したがって、ローカルマシンに Web サーバーをインストールするか、モデルを別の場所にアップロードし、jsonp を使用して URL を http://example.com/path/ to/ に変更します。モデル＃＃＃＃＃＃Origin は

RFC-6454

で定義されていますリーリーしたがって、ファイルが同じホスト (

localhost

) からのものであっても、スキームが異なる限り (http / file)、それらは異なるものとみなされます。）の起源。