如何启动一个本地静态服务器

背景

学习前端开发,想要调试静态页面以及js,发现直接本地打开会有跨域异常。因此,需要启动一个静态服务器,只负责当前目录的文件路由。

目前尝试了两种方式。一种是Nginx, 一种是NodeJS服务器。最终推荐NodeJS。

1. Nginx启动静态页面

1.1. 安装

下载安装Nginx,在Mac下安装如下:

brew install nginx

1.2 配置

Mac通过brew安装后的配置文件位于:/usr/local/etc/nginx.

修改端口和文件目录:

server {
        listen       8070;
        server_name  localhost;

        charset utf-8;

        #access_log  logs/host.access.log  main;

        location / {
            root   /Users/ryan/workspace/learning/react;
            index  index.html index.htm;
        }
....
}

1.3 启动和关闭

启动

nginx

关闭

nginx -s stop

启动后,打开浏览器,输入:localhost:8070/xxx.html即可。

2. 通过NodeJS的本地服务器

本次选用http-server

2.1 安装

npm install http-server -g

2.2 启动

http-server [path] [options]

Options

-p Port to use (defaults to 8080)

-a Address to use (defaults to 0.0.0.0)

-d Show directory listings (defaults to 'True')

-i Display autoIndex (defaults to 'True')

-g or --gzip When enabled (defaults to 'False') it will serve ./public/some-file.js.gz in place of ./public/some-file.js when a gzipped version of the file exists and the request accepts gzip encoding.

-e or --ext Default file extension if none supplied (defaults to 'html')

-s or --silent Suppress log messages from output

--cors Enable CORS via the Access-Control-Allow-Origin header

-o Open browser window after starting the server

-c Set cache time (in seconds) for cache-control max-age header, e.g. -c10 for 10 seconds (defaults to '3600'). To disable caching, use -c-1.

-U or --utc Use UTC time format in log messages.

-P or --proxy Proxies all requests which can't be resolved locally to the given url. e.g.: -P http://someurl.com

-S or --ssl Enable https.

-C or --cert Path to ssl cert file (default: cert.pem).

-K or --key Path to ssl key file (default: key.pem).

-r or --robots Provide a /robots.txt (whose content defaults to 'User-agent: *\nDisallow: /')

-h or --help Print this list and exit.

其他

直接使用IDEA或者webstom的用浏览器打开功能就可以了。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏Ryan Miao

centos-5.5安装vmvare tools

centos-5.5安装vmvare tools 虚拟机管理,安装tools 找到VMwareTools压缩包                         ...

2908
来自专栏鬼谷君

Nagios监控平台搭建

1712
来自专栏Android干货

Android studio 下的SDK Manager只显示已安装包的情况

2569
来自专栏吴小龙同學

Android ADB 命令行

用了 MBP,一直有个问题,不能像 Windows 一样直接拷贝文件到手机 SD 卡上,Android ADB 好像可以直接拷贝,但由于忙,没有去详细了解,最...

30810
来自专栏企鹅号快讯

py3.6+xadmin的自学网站搭建

xadmin安装 由于安装时需要依赖包并且暂时不支持py3等原因,直接pip install的方法很容易就狗带了。 说一下我在网上找到的安装方式,在GitHub...

22510
来自专栏Java学习123

myeclipse(eclipse)乱码处理

2455
来自专栏前端架构

intellij突然subversion不存在了,没有svn选项了……

600
来自专栏xingoo, 一个梦想做发明家的程序员

Express开发实例(2) —— Jade模板引擎

前一篇通过helloworld,简单介绍了Express中的开发,本篇继续深入的学习express的模板。 关于Jade的用法,网上有很多,本篇参考:Jad...

1936
来自专栏张善友的专栏

Jexus 支持PHP的三种方式

Jexus不仅支持ASP.NET,而且能够通个自带的PHP-FCGI服务以及PHP-FPM等方式灵活支持PHP而且还可以以.NET(Phalanger)方式支持...

1799
来自专栏雨过天晴

原 WIN + R 运行自定义命令

1214

扫描关注云+社区