If you’re developing html / javascript applications and want to test locally, many times you will go beyond what local file access (file:///C:/…) in browsers will allow (like XMLHttpRequests, json calls, cross domain access and Access-Control-Allow-Origin restrictions).
A simple solution instead of deploying your code to apache or IIS is to install a local http server. http-server for Node.js is a fast, easy install and app that will allow you to use any directory as a http://localhost.
Installing this simple http server only takes a few steps:
- Install node.js if you don’t already have installed (from http://nodejs.org)
- In a command prompt / terminal, now run:
npm install http-server -g
(this installs http-server globally so you can access from any folder or directory)
- Now using command prompt or terminal, browser to a folder with some html you want to serve as http. (ie: c:\someproject\).
- Run:
http-server
- Open your browser and visit http://localhost:8080.
You can change port 8080 (the default) to anything using “-p”, so http-server -p 8088 would change your local site to http://localhost:8088
Run http-server –help to see the other options available for running.
[…] Update, see my newer post on using node and http-server to create a local web server to get around these issues: Local web server for testing / development using Node.js and http-server […]
LikeLike
Reblogged this on Dinesh Ram Kali..
LikeLike
Worth to mention the other options availables, also if you pass a directory as argument so that will be root of the web server.
Available Options:
-p Port to listen for connections on (defaults to 8080)
-a Address to bind to (defaults to ‘0.0.0.0’)
-d Show directory listings (defaults to ‘True’)
-i Display autoIndex (defaults to ‘True’)
-e or –ext Default file extension (defaults to ‘html’)
-s or –silent In silent mode, log messages aren’t logged to the console.
-h or –help Displays a list of commands and exits.
-c Set cache time (in seconds) for cache-control max-age header, e.g. -c10 for 10 seconds. To disable caching, use -c-1.
LikeLike
Thanks Daniel, great stuff!
One day when I get some time I’d like to add an argument that allows custom headers to be added…
LikeLike
I tried this and still wasn’t able to utilize XMLHttpRequests, I’m getting the same “No ‘Access-Control-Allow-Origin’ header is present” error that I got before when using local file access.
LikeLike
Hi Chirs..many many thanks. Its a really helpful blog and it sorted my three hours problem..thank you
LikeLike
This is an awesome tutorial. Just what I needed to do a react tutorial. It used jsbin but I wanted to do it locally. Thank you for this article.
LikeLike
Thank you so much for the info, I’ve been looking for something like this for over an hour
LikeLike
I was strugglin with meteor. But you made my day! Thanks!
LikeLiked by 1 person
Great, now add explanation for people how to replace “npm install http-server -g” on a windows machine that’s NOT connected to the net?
P.S. The use of internet is only available for downloading files, no installation is possible on the machine that have internet. NPM is great as long as you have admin rights on the machine, but useles otherwise and no one is providing instructions how to overcome this …
LikeLiked by 1 person
A Windows web dev box that isn’t connected to the net and you don’t have admin rights for? I hope you’re working on some top secret government project (in a cool top secret facility). If not, why do that to yourself?
In any case, checkout https://github.com/arei/npmbox. “This lets you create a “box” of an installable package and move it to an offline system that will only install from that box.”
LikeLike
For some reason my Vagrant set-up stopped working.
Node FTW ! Thanks.
LikeLiked by 1 person