If you use just procedural geometries and don't load any textures, webpages should work straight from the file system, just double-click on HTML file in a file manager and it should appear working in the browser (you'll see file:///yourFile.html in the address bar).

Content loaded from external files

If you load models or textures from external files, due to browsers' [link:http://en.wikipedia.org/wiki/Same_origin_policy same origin policy] security restrictions, loading from a file system will fail with a security exception.

To solve this, run files from a local web server. This allows you to access your page as:

http://localhost/yourFile.html

While it is also possible to change browser security settings instead of running a local server, we do not recommend that approach. Doing so may open your device up to vulnerabilities, if the same browser is used for regular web surfing. Use of a local server is standard practice in web development, and we explain how to install and use a local server below.

Run a local server

Many programming languages have simple HTTP servers built in. They are not as full featured as production servers such as [link:https://www.apache.org/ Apache] or [link:https://nginx.org NGINX], however they should be sufficient for testing your three.js application.

Plugins for popular code editors

Some code editors have plugins which will spawn a simple server on demand.

[link:https://marketplace.visualstudio.com/items?itemName=yandeu.five-server Five Server] for Visual Studio Code.
[link:https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer Live Server] for Visual Studio Code.
[link:https://atom.io/packages/atom-live-server Live Server] for Atom.

Servez

[link:https://greggman.github.io/servez Servez] is a simple server with a GUI.

Node.js five-server

Development server with live reload capability. To install:


# Remove live-server (if you have it)
npm -g rm live-server

# Install five-server
npm -g i five-server

# Update five-server (from time to time)
npm -g i five-server@latest

To run (from your local directory):

five-server . -p 8000

Node.js http-server

Node.js has a simple HTTP server package. To install:

npm install http-server -g

To run (from your local directory):

http-server . -p 8000

Python server

If you have [link:http://python.org/ Python] installed, it should be enough to run this from a command line (from your working directory):


//Python 2.x
python -m SimpleHTTPServer

//Python 3.x
python -m http.server

This will serve files from the current directory at localhost under port 8000, i.e in the address bar type:

http://localhost:8000/

Ruby server

If you have Ruby installed, you can get the same result running this instead:


ruby -r webrick -e "s = WEBrick::HTTPServer.new(:Port => 8000, :DocumentRoot => Dir.pwd); trap('INT') { s.shutdown }; s.start"

PHP server

PHP also has a built-in web server, starting with php 5.4.0:

php -S localhost:8000

Lighttpd

Lighttpd is a very lightweight general purpose webserver. We'll cover installing it on OSX with HomeBrew here. Unlike the other servers discussed here, lighttpd is a full fledged production ready server.

Install it via homebrew brew install lighttpd
Create a configuration file called lighttpd.conf in the directory where you want to run your webserver. There is a sample [link:http://redmine.lighttpd.net/projects/lighttpd/wiki/TutorialConfiguration here].
In the conf file, change the server.document-root to the directory you want to serve files from.
Start it with lighttpd -f lighttpd.conf
Navigate to http://localhost:3000/ and it will serve static files from the directory you chose.

IIS

If you are using Microsoft IIS as web server. Please add a MIME type settings regarding .fbx extension before loading.

File name extension: fbx MIME Type: text/plain

By default, IIS blocks .fbx, .obj files downloads. You have to configure IIS to enable these kind of files can be download.

Other simple alternatives are [link:http://stackoverflow.com/q/12905426/24874 discussed here] on Stack Overflow.

[name]