在docker中部署本地html静态网页

meetz · 发表于 2025-12-26 11:40:35

马上注册，结交更多好友，享用更多功能，让你轻松玩转社区。

您需要登录才可以下载或查看，没有账号？立即注册

×

本帖最后由 whpQO8 于 2025-12-26 11:44 编辑

关于如何在 nas 上部署本地html静态网页
本篇采用在 docker 中部署 nginx 容器代理静态网页资源的方式实现~

1.找个自己喜欢的位置自行创建文件夹位置&名称随意但要记住后面要用
示例:
nginx/html -- 放html 文件
nginx/conf -- 这个待会要放 nginx 的配置文件

附图:

2.下载 nginx 镜像
打开docker 镜像仓库里第一个就是了, 直接下载

3.创建部署镜像
找到下载好的镜像点击创建

重点来了!!

写好后点击确定 ,在[容器]页面就可以看到创建好的容器了, 还没完继续👀

4.编写nginx 配置文件
回到文件管理在 1.中创建的文件夹
在nginx/conf 目录下创建 ng.conf 文件

文件内容示例:

server {
listen 80;
server_name localhost;
# 指向挂载的静态文件目录（容器内路径）
location / {
root /home; # 这块是刚刚创建容器写的容器内放html的文件目录
index index.html index.htm; ## 这块对应的是你的html文件
try_files $uri $uri/ /index.html; # 适配前端SPA路由
}

5.放置你的 html 文件
在nginx/html 目录下放你的 html 文件

我这边写个简单的 html 文件作为示例, 示例内容:

<!doctype html>
<html lang="en">
<head>
<title>Code coverage report for utf8.js/</title>
<meta charset="utf-8">
<h1>hello 网页内容o.O</h1>
</body>
</html>

6.重启创建好的 nginx 容器吧

重启完之后我这边点击访问报错看日志发现遇到权限问题😠!!!!

别急接下来打开容器终端变更下权限

终端输入命令: chown -R nginx:nginx /home

执行之后 ,重启容器再次访问~

至此可以正常访问刚才的示例网页啦,

如有其他问题欢迎评论区交流讨论👏🏻
下课!🤔

meetz · 发表于 2025-12-26 16:30:23

文中 nginx 有遗漏, 现补充:

server {
listen 80;
server_name localhost;
# 指向挂载的静态文件目录（容器内路径）
location / {
root /home; # 这块是刚刚创建容器写的容器内放html的文件目录
index index.html index.htm; ## 这块对应的是你的html文件
try_files $uri $uri/ /index.html; # 适配前端SPA路由
}
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root /usr/share/nginx/html;
}
}

复制代码

PEPZY5 · 发表于 2025-12-31 07:58:55

这玩意用的都会不用的都不会看

zoyo · 发表于 2026-1-25 09:11:47

这个好，感谢，群晖有自带的，我还想官方提建议，哈哈。

VbsjuQ · 发表于 2026-3-25 17:20:11

太感谢了，小白一个最近搞得NAS，然后搭建了一个工作网站，还差点被AI忽悠跑到家里搞定，总算看到你这篇文章搞定了

[玩法教程] 在docker中部署本地html静态网页

马上注册，结交更多好友，享用更多功能，让你轻松玩转社区。

电梯直达
评论4

评论

浏览过的版块

[玩法教程] 在docker中部署本地html静态网页

马上注册，结交更多好友，享用更多功能，让你轻松玩转社区。

电梯直达 评论4

评论

浏览过的版块

电梯直达
评论4