You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
184 lines
7.8 KiB
184 lines
7.8 KiB
<!DOCTYPE html>
|
|
<html lang="ru">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<base href="../../../"/>
|
|
<script src="page.js"></script>
|
|
<link type="text/css" rel="stylesheet" href="page.css"/>
|
|
</head>
|
|
<body>
|
|
<h1>Локальная разработка ([name])</h1>
|
|
<p>
|
|
Если вы используете только процедурную геометрию и не загружаете никаких текстур, веб-страницы должны работать
|
|
прямо из файловой системы, просто дважды щелкните по HTML-файлу в файловом менеджере, и он
|
|
должен появиться в браузере (вы увидите <em>file:///вашФайл.html </em> в адресной строке).
|
|
</p>
|
|
|
|
<h2>Контент загружен из внешних файлов</h2>
|
|
<div>
|
|
<p>
|
|
Если вы загружаете модели или текстуры из внешних файлов, из-за того, что браузеры
|
|
[link:http://en.wikipedia.org/wiki/Same_origin_policy same origin policy](политика одинакового происхождения)
|
|
ограничения безопасности, загрузка из файловой системы завершится ошибкой с исключением безопасности.
|
|
</p>
|
|
|
|
<p>
|
|
Чтобы решить эту проблему, запустите файлы с локального веб-сервера. Это позволит вам получить доступ к вашей
|
|
странице как:
|
|
</p>
|
|
|
|
<p>
|
|
<code>http://localhost/yourFile.html</code>
|
|
</p>
|
|
|
|
<p>
|
|
Хотя также можно изменить настройки безопасности браузера вместо запуска локального сервера,
|
|
мы не рекомендуем такой подход. Это может открыть ваше устройство для уязвимостей, если
|
|
тот же браузер используется для обычного веб-серфинга. Использование локального сервера является стандартной
|
|
практикой в
|
|
веб-разработки, и ниже мы объясним, как установить и использовать локальный сервер.
|
|
</p>
|
|
</div>
|
|
|
|
|
|
<h2>Запуск локального сервера</h2>
|
|
<div>
|
|
<p>
|
|
Многие языки программирования имеют встроенные простые HTTP-серверы. Они не так полнофункциональны, как
|
|
рабочие серверы, такие как [link:https://www.apache.org/ Apache] или [link:https://nginx.org NGINX], однако их
|
|
должно быть достаточно для тестирования вашего
|
|
three.js приложение.
|
|
</p>
|
|
|
|
<h3>Плагины для популярных редакторов кода</h3>
|
|
<div>
|
|
<p>В некоторых редакторах кода есть плагины, которые по запросу создают простой сервер.</p>
|
|
<ul>
|
|
<li>[link:https://marketplace.visualstudio.com/items?itemName=yandeu.five-server Five Server] для Visual
|
|
Studio Code.
|
|
</li>
|
|
<li>[link:https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer Live Server] для Visual
|
|
Studio Code.
|
|
</li>
|
|
<li>[link:https://atom.io/packages/atom-live-server Live Server] для Atom.</li>
|
|
<li>для ide от jetbrains уже все из коробки (как всегда)</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<h3>Servez</h3>
|
|
<div>
|
|
<p>
|
|
[link:https://greggman.github.io/servez Servez] это простой сервер с графическим интерфейсом.
|
|
</p>
|
|
</div>
|
|
|
|
<h3>Node.js five-server</h3>
|
|
<div>
|
|
<p>Сервер разработки с возможностью горячей перезагрузки. Установка:</p>
|
|
<code>
|
|
|
|
# Удалите live-server (если он у вас есть)
|
|
npm -g rm live-server
|
|
|
|
# Установите five-server
|
|
npm -g i five-server
|
|
|
|
# Обновление five-server (иногда)
|
|
npm -g i five-server@latest
|
|
</code>
|
|
|
|
<p>Для запуска (из вашей локальной директории):</p>
|
|
<code>five-server . -p 8000</code>
|
|
</div>
|
|
|
|
<h3>Node.js http-server</h3>
|
|
<div>
|
|
<p>Node.js имеет простой пакет HTTP-сервера. Установка:</p>
|
|
<code>npm install http-server -g</code>
|
|
|
|
<p>Для запуска (из вашей локальной директории):</p>
|
|
<code>http-server . -p 8000</code>
|
|
</div>
|
|
|
|
<h3>Python сервер</h3>
|
|
<div>
|
|
<p>
|
|
Если у вас установлен [link:http://python.org/ Python], этого должно быть достаточно для запуска
|
|
из командной строки (из вашей локальной директории):
|
|
</p>
|
|
<code>
|
|
//Python 2.x
|
|
python -m SimpleHTTPServer
|
|
|
|
//Python 3.x
|
|
python -m http.server
|
|
</code>
|
|
|
|
<p>Это поднимет сервер для файлов из текущего каталога на localhost на порте 8000, т.е. в адресной строке
|
|
введите:</p>
|
|
|
|
<code>http://localhost:8000/</code>
|
|
</div>
|
|
|
|
<h3>Ruby сервер</h3>
|
|
<div>
|
|
<p>Если у вас установлен Ruby, вы можете получить тот же результат, выполнив:</p>
|
|
<code>
|
|
ruby -r webrick -e "s = WEBrick::HTTPServer.new(:Port => 8000, :DocumentRoot => Dir.pwd); trap('INT') { s.shutdown }; s.start"
|
|
</code>
|
|
</div>
|
|
|
|
<h3>PHP сервер</h3>
|
|
<div>
|
|
<p>PHP также имеет встроенный веб-сервер, начиная с php 5.4.0:</p>
|
|
<code>php -S localhost:8000</code>
|
|
</div>
|
|
|
|
<h3>Lighttpd</h3>
|
|
<div>
|
|
<p>
|
|
Lighttpd - это очень легкий веб-сервер общего назначения. Мы рассмотрим установку его на OSX с помощью
|
|
HomeBrew. В отличие от других серверов, обсуждаемых здесь, lighttpd является полноценным прод. сервером.
|
|
</p>
|
|
|
|
<ol>
|
|
<li>
|
|
Установка с помощью homebrew
|
|
<code>brew install lighttpd</code>
|
|
</li>
|
|
<li>
|
|
Создайте конфигурационный файл с именем lighttpd.conf в каталоге, в котором вы хотите запустить
|
|
ваш веб-сервер. Пример [link:http://redmine.lighttpd.net/projects/lighttpd/wiki/TutorialConfiguration
|
|
here].
|
|
</li>
|
|
<li>
|
|
В файле conf измените корневой каталог server.document на каталог, из которого вы хотите обслуживать
|
|
файлы.
|
|
</li>
|
|
<li>
|
|
Запуск
|
|
<code>lighttpd -f lighttpd.conf</code>
|
|
</li>
|
|
<li>
|
|
Перейдите в http://localhost:3000/ и он будет обслуживать статические файлы из каталога, который вы
|
|
выбрали.
|
|
</li>
|
|
</ol>
|
|
</div>
|
|
<h3>IIS</h3>
|
|
<div>
|
|
<p>Если вы используете Microsoft IIS в качестве веб-сервера. Пожалуйста, добавьте настройки типа MIME для
|
|
расширения .fbx перед загрузкой.</p>
|
|
<code>File name extension: fbx MIME Type: text/plain</code>
|
|
<p>По умолчанию IIS блокирует загрузку файлов .fbx, .obj. Вы должны настроить IIS, чтобы такие файлы можно было
|
|
загружать.</p>
|
|
</div>
|
|
<p>
|
|
Другими простыми альтернативами являются [link:http://stackoverflow.com/q/12905426/24874 discussed
|
|
here](обсуждается здесь)
|
|
на Stack Overflow.
|
|
</p>
|
|
</div>
|
|
|
|
</body>
|
|
</html>
|
|
|