Docker之Nginx前端部署(Windows版-x86_64(AMD64)-离线)

需求:部署的Windows电脑(x86_64)是内网,所以需要提前在有网的Windows电脑(x86_64)上下载Nginx镜像,然后内网电脑加载镜像后即可运行Vue项目。

Windows 主流架构:x86_64(AMD64) 和 ARM64;

Linux 主流架构:x86_64(AMD64) 和 ARM64(AArch64)。

一、查看容器Containers与Images镜像

1、容器Containers

注意:当前nginx 容器目前还处于运行状态,Docker 不允许直接删除正在运行的容器,必须先停止容器。

bash 复制代码
# 第一步:停止运行中的 nginx 容器
docker stop nginx

# 第二步:删除已停止的容器
docker rm nginx

2、Images镜像

镜像正在被某个容器使用,必须先删除使用它的容器才能继续删除镜像。

注意:删镜像前先把相关容器删除。

3、清空Nginx相关容器与镜像


二、拉取Nginx最新版本镜像

1、运行nginx容器


bash 复制代码
docker run -d --name nginx -p 8085:85 -v "E:/test/dist:/usr/share/nginx/html/dist" -v "E:/test/nginx.conf:/etc/nginx/conf.d/default.conf" nginx

因为现在docker里没有Nginx容器所以会自动下载最新版本的Nginx镜像然后运行该容器。

步骤 1:自动拉取 nginx 镜像

因为本地没有 nginx 镜像,Docker 会先从官方仓库(Docker Hub)下载 nginx:latest 镜像(默认拉取 latest 标签),终端会显示下载进度:

步骤 2:创建并启动 nginx 容器

镜像下载完成后,Docker 会按照你指定的参数创建并启动容器:

--name nginx:给容器命名为 nginx(这也是为什么第一步删不存在的容器报错不影响 ------ 这里会新建);

-p 8085:85:将主机 8085 端口映射到容器 85 端口;

-v "E:/test/dist:/usr/share/nginx/html/dist":将主机 E:/test/dist 目录挂载到容器内指定路径;

-v "E:/test/nginx.conf:/etc/nginx/conf.d/default.conf":将主机的 nginx.conf 配置文件挂载为容器的默认配置;

-d:后台运行容器。

2、下载镜像

①方法1

bash 复制代码
# 导出 nginx 镜像为本地文件(比如保存到 E盘)
docker save -o E:\nginx-image.tar nginx:latest


②方法2

三、离线部署

1、加载镜像

把之前下载的Nginx镜像拷贝到离线的Windows电脑上,运行命令:

bash 复制代码
docker load -i E:\nginx-image.tar

可以看到Nginx镜像已经成功加载进来了。

2、运行Nginx容器

可以看见,Nginx容器成功启动了,现在可以打开浏览器,访问 http://localhost:8085。

3、补充说明

Nginx版本其实是Linux x86 架构的,但是Nginx 也能在 Windows x86 上离线运行镜像。
Docker之Windows与Linux不同架构部署理解

相关推荐
门思科技1 小时前
LoRaWAN 网络排障的五层漏斗:从"上不到云"到"数值不对",每一层该用什么工具证明
前端
计算机魔术师1 小时前
Cursor 官方插件商城现恶意 Claude Code 扩展,约 11 小时影响最多 5000 名开发者
前端
acd120091 小时前
Nginx 反向代理的缓冲区坑:后端响应大时接口偶发 502
java·运维·nginx
掘金者阿豪1 小时前
MongoDB迁移到金仓数据库:商品属性继续灵活存,订单报表交给 SQL
前端·后端
栉甜2 小时前
Vue2学习内容(上)
前端·javascript·vue.js·学习
Blockbuater_drug2 小时前
Dify 1.18 本地部署实战:Windows + WSL2 + Docker,从零跑到本地可用
windows·docker·容器·dify·大模型应用平台
梦曦i2 小时前
v0.2.0 架构升级:class + reactive 重塑状态管理
前端·uni-app x
布丁爱干饭2 小时前
寄给午后
前端
Thanks_ks2 小时前
常见 HTTP 状态码的坑:301/302、401/403、500/502 之间差的那一个词
计算机网络·nginx·http·面试·状态码·后端开发·浏览器缓存
java1234_小锋2 小时前
【技术专题】CSS3 网页技术 - CSS3 布局进阶
前端·css·css3