Docker部署全流程

一、确保要部署的服务器上配置好docker以及nginx

1.docker

2.nginx

二、开始将我们的项目替换为docker方式部署

!!!通过github保存代码、阿里云打包成镜像、服务器拉取镜像

1.在github上创建仓库

创建成功后,分为以下两种方式与本地仓库关联,执行命令:

2.自己的项目根目录(我创建的ssr基础项目)

我已经创建好项目了,因此使用第二种方式将本地仓库和github关联

使用git管理工具提交项目代码

提交成功!

3.使用阿里云创建镜像(阿里云镜像服务

第一步创建命令空间

第二步创建镜像仓库

第三步关联镜像仓库

第四步添加构建规则

到这里已经配置好自动构建镜像的流程了,要实现构建流程需要用到Dockerfile;接下来来配置下这个文件吧

Dockerfile 配置(根据各自的项目进行配置,这里仅针对我这个项目)

bash 复制代码
# 阶段一:构建阶段 - 使用包含 pnpm 的 Node.js 镜像
FROM node:20-alpine as build-stage

# 安装pnpm
RUN corepack enable && corepack prepare pnpm@latest --activate

# 设置工作目录
WORKDIR /app

# 复制 package.json 和 pnpm 锁文件
COPY package.json pnpm-lock.yaml ./

# 使用 pnpm 安装所有依赖
RUN pnpm install --frozen-lockfile

# 复制源代码
COPY . .

# 构建应用
RUN pnpm run build

# SSR
FROM node:20-alpine as production-stage

WORKDIR /app

COPY --from=build-stage /app/.output ./.output

EXPOSE 3000

CMD ["node", ".output/server/index.mjs"]

配置完毕,修改个项目文件,将代码提到github上去试试看!

阿里云已经检测到github代码更新,自动构建啦!

构建成功!接下来我们去服务器上将镜像拉下来试试看吧!

三、服务器拉取我们构建好的镜像

1.执行第一、第二步

2.查看Docker镜像

复制代码
docker images

3.运行Docker容器

bash 复制代码
docker run -d -p 3000:3000 --name docker-ssr crpi-wcf58fnwn5pjdazj.cn-hangzhou.personal.cr.aliyuncs.com/sakura-13033603886/docker-deploy-ssr:1.0.0

4.验证容器

复制代码
docker ps
docker logs docker-ssr

5.验证容器的服务是否在本地启动

arduino 复制代码
curl http://localhost:3000

结果为你的服务响应即可!

四、配置nginx代理

bash 复制代码
# 进入配置目录
cd /etc/nginx/sites-available/

# 查看文件
ls

# 将原配置做个备份
cp default default-basic

# 修改nginx配置文件
vi default

# 修改所有内容为:
# emi 服务器 nginx配置
server {
    listen 80 default_server;
    listen [::]:80 default_server;
    server_name zijideyuming.com;#这个为自己的域名
    
    # 配置html静态文件
    location / {
        proxy_pass http://localhost:3000; #node.js默 认 端 口
        # proxy_set_header Upgrade $http_upgrade;
        # proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
    }  
}

# 重启nginx
sudo nginx -s reload
sudo systemctl restart nginx

五、完成所有配置啦!

快使用zijideyuming.com去访问下试试看吧!

相关推荐
dyj0954 小时前
Dify - (一)、本地部署Dify+聊天助手/Agent
人工智能·docker·容器
QQ1__8115175154 小时前
Spring boot名城小区物业管理系统信息管理系统源码-SpringBoot后端+Vue前端+MySQL【可直接运行】
前端·vue.js·spring boot
钛态4 小时前
前端微前端架构:大项目的救命稻草还是自找麻烦?
前端·vue·react·web
一粒黑子4 小时前
【实战解析】阿里开源 PageAgent:纯前端 GUI Agent,一行JS让网页支持自然语言操控
前端·javascript·开源
独角鲸网络安全实验室4 小时前
2026微信小程序抓包全解析:从实操落地到合规风控,解锁前端调试新范式
前端·微信小程序·小程序·抓包·系统代理绕过·https证书严格校验·进程隔离
紫微AI4 小时前
前端文本测量成了卡死一切创新的最后瓶颈,pretext实现突破了
前端·人工智能·typescript
GISer_Jing4 小时前
AI前端(From豆包)
前端·aigc·ai编程
IT枫斗者4 小时前
前端部署后如何判断“页面是不是最新”?一套可落地的版本检测方案(适配 Vite/Vue/React/任意 SPA)
前端·javascript·vue.js·react.js·架构·bug
测试修炼手册4 小时前
[测试技术] 深入理解 JSON Web Token (JWT)
前端·json
AI老李4 小时前
2026 年 Web 前端开发的 8 个趋势!
前端