轻量级服务器http-server详解
<div id="navCategory"><h5 class="catalogue">目录</h5><ul class="first_class_ul"><li><a href="#_label0">安装</a></li><li><a href="#_label1">运行</a></li><li><a href="#_label2">常用配置参数</a></li><ul class="second_class_ul"><li><a href="#_lab2_2_0">charles代理本地，需重启</a></li></ul><li><a href="#_label3">项目设置</a></li><ul class="second_class_ul"></ul><li><a href="#_label4">配置Charles</a></li><ul class="second_class_ul"></ul></ul></div><p class="maodian"><a name="_label0"></a></p><h2>安装</h2><p>sudo npm install http-server -g</p>
<p class="maodian"><a name="_label1"></a></p><h2>运行</h2>
<p>1. 直接去到要跑起来的目录，在终端输入</p>
<ul><li>cd xxxx文件夹</li><li>http-server //只输入http-server的话，更新了代码后，页面不会同步更新</li><li>http-server -c-1 //同步更新页面</li><li>http-server -a 127.0.0.1 -p 8080 -c-1 //同步更新页面并且设置了ip和端口号</li><li>// 按快捷键CTRL-C 关闭http-server服务</li></ul>
<p>2. 浏览器直接输入提示地址</p>
<p style="text-align:center"><img alt="" src="https://img.jbzj.com/file_images/article/202502/2025021209123018.png" /></p>
<p class="maodian"><a name="_label2"></a></p><h2>常用配置参数</h2>
<ul><li>-p 端口号 (默认 8080)</li><li>-a IP 地址 (默认 0.0.0.0)</li><li>-d 显示目录列表 (默认 'True')</li><li>-i 显示 autoIndex (默认 'True')</li><li>-e or --ext 如果没有提供默认的文件扩展名(默认 'html')</li><li>-s or --silent 禁止日志信息输出</li><li>--cors 启用 CORS via the Access-Control-Allow-Origin header</li><li>-o 在开始服务后打开浏览器</li><li>-c 为 设置缓存控制max-age头的缓存时间(秒) , 如-c10即 10s (默认 为 '3600'). 禁用缓存, 则使用 -c-1.</li><li>-U 或 --utc 使用UTC time 格式化log消息</li><li>-P or --proxy 代理无法在本地解决给定网址对所有请求 如: -P http://someurl.com</li><li>-S or --ssl 启用 https</li><li>-C or --cert ssl证书文件路径 (默认值: cert.pem)</li><li>-K or --key ssl密钥文件路径 (默认值: key.pem).</li><li>-r or --robots 提供一个 /robots.txt (其内容默认为'User-agent: *\nDisallow: /')</li><li>-h or --help 打印此列表并退出</li></ul>
<p class="maodian"><a name="_lab2_2_0"></a></p><h3>charles代理本地，需重启</h3>
<p class="maodian"><a name="_label3"></a></p><h2>项目设置</h2>
<p>代理本地资源，需要本地资源可在局域网内访问</p>
<p>修改项目中webpack-dev-server的host配置为:0.0.0.0,这样设置后，就支持localhost和IP两种访问方式(其他非webpack-dev-server启动服务的资源文件可以使用nginx或单独创建一个服务的形式处理)</p>
<p style="text-align:center"><img alt="" src="https://img.jbzj.com/file_images/article/202502/2025021209123019.jpg" /></p>
<p>启动项目后，访问地址就是IP:8080方式访问，在同局域网内的也可以访问</p>
<p style="text-align:center"><img alt="" src="https://img.jbzj.com/file_images/article/202502/2025021209123120.png" /></p>
<p class="maodian"><a name="_label4"></a></p><h2>配置Charles</h2>
<p>打开Charles，设置系统代理</p>
<p style="text-align:center"><img alt="" src="https://img.jbzj.com/file_images/article/202502/2025021209123121.png" /></p>
<p>设置需要代理的文件或者文件路径</p>
<p>Tools -> Map Remote -> 勾选 Enable Map Remote -> 点击add。</p>
<p>由于打包的加载方式和开发的加载方式不同，设置应该遵循开发的方式。</p>
<p>如：线上模式有app和manifest两个资源文件，子页面是manifest的版本命名来加载的，而在开发模式下只有app，子页面直接从app中的路由命名到内存中加载文件，所以，我们只需要设置app的代理，然后将app里加载的文件代理一个文件夹即可</p>
<p style="text-align:center"><img alt="" src="https://img.jbzj.com/file_images/article/202502/2025021209123122.png" /></p>
<p style="text-align:center"><img alt="" src="https://img.jbzj.com/file_images/article/202502/2025021209123123.png" /></p>
<p style="text-align:center"><img alt="" src="https://img.jbzj.com/file_images/article/202502/2025021209123224.png" /></p>
<p style="text-align:center"><img alt="" src="https://img.jbzj.com/file_images/article/202502/2025021209123225.png" /></p>
<p>设置成功后，重启Charles</p>
<p>访问线上的代理域名查看Charles：</p>
<p style="text-align:center"><img alt="" src="https://img.jbzj.com/file_images/article/202502/2025021209123226.jpg" /></p>
<p>到此这篇关于轻量级服务器http-server的文章就介绍到这了,更多相关服务器http-server内容请搜索琼殿技术社区以前的文章或继续浏览下面的相关文章希望大家以后多多支持琼殿技术社区！</p>
頁:
[1]