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

简介:

背景

学习前端开发,想要调试静态页面以及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的用浏览器打开功能就可以了。



本文转自Ryan.Miao博客园博客,原文链接:http://www.cnblogs.com/woshimrf/p/http-server-static.html,如需转载请自行联系原作者

相关文章
|
存储 大数据 API
大数据隐私保护策略:加密、脱敏与访问控制实践
【4月更文挑战第9天】本文探讨了大数据隐私保护的三大策略:数据加密、数据脱敏和访问控制。数据加密通过加密技术保护静态和传输中的数据,密钥管理确保密钥安全;数据脱敏通过替换、遮蔽和泛化方法降低敏感信息的敏感度;访问控制则通过用户身份验证和权限设置限制数据访问。示例代码展示了数据库、文件系统和API访问控制的实施方式,强调了在实际应用中需结合业务场景和平台特性定制部署。
3469 0
|
数据采集 JavaScript 测试技术
史上最全测试开发工具推荐(含自动化、APP性能、稳定性、抓包神器)
在本篇文章中,将给大家推荐14款日常工作中经常用到的测试开发工具神器,涵盖了自动化测试、APP性能测试、稳定性测试、抓包工具等。
4827 0
史上最全测试开发工具推荐(含自动化、APP性能、稳定性、抓包神器)
|
机器学习/深度学习 人工智能 自然语言处理
ModelScope在线体验模型测试
ModelScope在线体验模型测试
42113 3
ModelScope在线体验模型测试
|
9月前
|
人工智能 自然语言处理 数据挖掘
田渊栋团队新作祭出Agent-as-a-Judge!AI智能体自我审判,成本暴跌97%
田渊栋团队提出Agent-as-a-Judge框架,利用智能体自身评估其他智能体的性能,不仅关注最终结果,还能提供中间反馈,更全面准确地反映智能体的真实能力。该框架在DevAI基准测试中表现出色,成本效益显著,为智能体的自我改进提供了有力支持。
256 7
|
编解码 人工智能 物联网
CogVLM2: 智谱开源新一代多模态大模型!
智谱·AI推出了新一代 CogVLM2 系列模型,并开源了使用 Meta-Llama-3-8B-Instruct 构建的两个模型。 与上一代CogVLM开源模型相比,CogVLM2系列开源模型有了很多改进...
|
Linux Shell Go
Linux中文件操作基本指令大全
Linux中文件操作基本指令大全
|
语音技术
解决input中输入中文过程中会触发input事件的问题
解决input中输入中文过程中会触发input事件的问题
378 0
|
UED 开发者 Python
使用Python构建命令行工具:argparse和click库的使用
使用Python构建命令行工具:argparse和click库的使用
385 0
|
开发工具 UED
聊聊技术选型
聊聊技术选型
1348 0