ホームページ > 記事 > ウェブフロントエンド > ローカルでthree.jsを実行する方法の詳細な説明
この記事では主に、three.js 中国語ドキュメント学習をローカルで実行する方法に関する関連情報を、サンプル コードを通じて詳しく紹介します。これは、学習や仕事に必要なすべての人の参考になります。フォローできます 編集者と一緒に学びましょう。
外部ファイルからコンテンツをロードする
外部ファイルからモジュールやマテリアルをダウンロードする場合、ブラウザの同一生成元ポリシーのセキュリティ制限により、セキュリティ例外がスローされ、ロードは失敗します。
解決策は 2 つあります:
ブラウザでローカル ファイルのセキュリティを変更します。次のように Web ページに入ることができます:
file:///yourFile.html
ローカル Web サーバーからファイルを実行すると、次のように Web ページに入ることができます:
http://localhost/yourFile.html
最初の方法を使用する場合は、必ず同じブラウザを使用してください (セキュリティを変更した後) 通常、インターネットをサーフィンすると、脆弱な状態になります。セキュリティを確保するためのみ、ローカル開発用に別のブラウザー構成とショートカットを作成できます。それぞれの方法を順番に見ていきましょう。
ローカルサーバーを実行する
多くのプログラミング言語にはHTTPサーバーが組み込まれています。 Apache や NGINX のすべての機能は備えていませんが、three.js アプリケーションをテストするには十分です。
Node.js サーバー
にはシンプルな HTTP サーバー インストール パッケージがあり、インストール:
npm install http-server -g
実行:
http-server -p 8000
Python サーバー
Python がインストールされている場合は、作業ディレクトリで次のコマンド ラインを実行します:
//Python 2.x python -m SimpleHTTPServer //Python 3.x python -m http.server
サービスを開始するには、現在のディレクトリからローカルホストのポート 80 に移動します。アドレス バーは次のとおりです:
http://localhost:8000/
PHP サーバー
PHP には、組み込み Web サーバー (php 5.4.0 以降) もあります。
php -S localhost:8000Ruby サーバー
ruby -r webrick -e "s = WEBrick::HTTPServer.new(:Port => 8000, :DocumentRoot => Dir.pwd); trap('INT') { s.shutdown }; s.start"Lighttpd
brew install loghttpdWeb サーバーを実行する場所に lighttpd.conf という構成ファイルを作成します。例:
server.document-root = "/var/www/servers/www.example.org/pages/" server.port = 3000 mimetype.assign = ( ".html" => "text/html", ".txt" => "text/plain", ".jpg" => "image/jpeg", ".png" => "image/png" )設定ファイルで、server.document-root を、提供する必要があるディレクトリに変更します。
lighttpd -f lighttpd.confhttp://localhost:3000/ と入力して、選択したディレクトリから静的ファイルを提供します。
環境設定パネルを使用して、[開発者向けオプション] をオンにします: [詳細] -> [メニュー バーに開発メニューを表示]。
次に、[開発] -> [ローカルを無効にする]ファイル制限。編集とデバッグに Safari を使用する場合、Safari はキャッシュに関して常に奇妙な動作をすることに注意してください。そのため、同じメニューで [キャッシュを無効にする] をクリックするのが賢明な選択です。
chrome
まず、実行中のすべての chrome インスタンスを閉じます。すべてを覚えておいてください。
Windows では、プロセス マネージャーを使用して、プロセス マネージャーがすべて閉じられているかどうかを確認する必要があります。または、システム トレイに Chrome アイコンが表示されている場合は、右クリック メニューを開いて [終了] をクリックします。これにより、すべてのインスタンスがシャットダウンされます。
次に、コマンド ライン フラグを使用して Chrome プログラムを起動します:
chrome --allow-file-access-from-files
Window の下で、最も簡単な方法は、特別なショートカット アイコンを作成し、最後に上記のロゴを追加することです。 (Chromeのショートカットを右クリック→プロパティ→ターゲット)
Firefox
アドレスバーにabout:configと入力します
security.fileuri.strict_origin_policyパラメータを見つけます
falseに設定します
その他の方法は単純です。どちらの方法も Stack Overflow で説明されています。
関連する推奨事項:
以上がローカルでthree.jsを実行する方法の詳細な説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。