Nodejs+http-server 使用 http-server 快速搭建本地图片访问服务

在开发过程中,我们经常需要临时查看或分享本地的图片资源,比如设计稿、截图、素材等。虽然可以通过压缩发送,但效率不高。本文将教你使用 Node.js 的一个轻量级工具 ------ http-server,快速搭建一个本地 HTTP 图片预览服务,支持浏览器访问和局域网共享。

🔧 第一步:安装 Node.js

如果你还没有安装 Node.js,请前往官网下载并安装:

🔗 https://nodejs.org/

安装完成后,在命令行中执行以下命令验证是否安装成功:

复制代码
node -v
npm -v

如果能看到版本号输出,说明安装成功!

🔧 第二步:全局安装 http-server

http-server 是一个零配置的静态文件服务器,非常适合用来快速启动本地服务。

执行以下命令进行安装:

复制代码
npm install -g http-server

如果你在国内,建议使用淘宝镜像加速安装:

复制代码
npm install -g http-server --registry=https://registry.npmmirror.com

🚀 第三步:进入图片目录并启动服务

打开命令行工具(Windows 使用 CMD 或 PowerShell,macOS/Linux 使用 Terminal)

进入你的图片文件夹路径,例如

复制代码
cd C:\Users\你的用户名\Pictures

启动服务,默认端口是 8080:

复制代码
http-server -p 8000 -o

或者指定端口为 3000:

复制代码
http-server -p 3000 -o

🖥️ 第四步:浏览器访问图片服务

服务启动后,你会看到如下输出:

复制代码
Starting up http-server, serving ./
Available on:
  http://127.0.0.1:3000
  http://192.168.x.x:3000
Hit CTRL-C to stop the server

打开浏览器,输入以下任意地址即可访问:

本机访问:

复制代码
http://localhost:3000

局域网访问(其他设备):

复制代码
http://你的IP地址:3000

你将会看到当前目录下的所有文件列表,点击即可直接浏览图片内容。

🌐 拓展功能(可选)

开启跨域访问(CORS)

如果你希望网页通过 JavaScript 跨域访问这些图片资源,可以加上 --cors 参数:

复制代码
http-server --cors
关闭缓存

避免浏览器缓存旧文件:

复制代码
http-server -c 0
使用 HTTPS(进阶)
复制代码
http-server --ssl --cert cert.pem --key key.pem

你需要提前准备好 SSL 证书文件。

停止服务

按下键盘上的:

复制代码
Ctrl + C

然后输入 Y 确认终止服务即可。

相关推荐
2601_963282776 小时前
寒地窄带通信工程实践:黑龙江哈尔滨对讲机选型、组网与合规运维总结
运维·服务器·网络
是真的小外套8 小时前
网络安全实战第14期:Week2周末闯关
网络·安全·web安全
xbzb8 小时前
OpenStack 网络管理(理论):Linux 网络虚拟化是 Neutron 的地基
linux·服务器·网络·openstack·network·neutron
QXWZ_IA10 小时前
边坡监测预算有限时的建设顺序:虚拟基准站与成本账
网络·数据库
聪明蛋子哟13 小时前
大模型应用“最后一公里”:从Prompt工程到MCP协议,如何实现跨系统的高可用集成?
网络·prompt
科创致远14 小时前
ESOP 电子作业指导书 WiFi 网络应用实测报告
运维·服务器·网络
承渊政道14 小时前
Linux网络学习【从NAT与代理服务理解网络转发、探索内网穿透原理、再到认识DNS与ICMP、最后动手部署并测试内网穿透】
linux·网络·学习·内网穿透·dns·nat
最强小杰14 小时前
minimax-m3 突然报 HTTP 529 怎么办?连续重试为何更难恢复,退避时间该怎么算?
网络·网络协议·http·ai
程序员清风14 小时前
AI 编程助手的权限边界:文件、命令、密钥与人工确认
运维·服务器·网络
别讲概念15 小时前
JavaEE(5)网络原理初识
网络·java-ee·智能路由器