前言最近我把一个基于 ASP.NET Core 8.0 后端 Vue 3 前端的个人作品集项目部署到了云服务器上。之前也踩了不少坑——镜像拉取超时、413上传文件大小限制、图标缓存、Docker Compose版本兼容问题……网上资料比较零散我干脆把这次部署的完整过程整理成一篇文章希望能给同样在折腾Docker部署的朋友一些参考。项目基本情况后端ASP.NET Core 8.0 Web API提供 RESTful 接口前端Vue 3 Vite Element Plus数据库远程 MySQL部署在同一台云服务器上服务器Ubuntux86_64架构部署方式Docker Compose前端Nginx容器 后端ASP.NET Core容器最终访问方式前端入口http://你的服务器IP:8888后端API通过Nginx反向代理转发不对外直接暴露一、环境准备1.1 安装 Docker 和 Docker Composebash# 安装 Docker sudo apt update sudo apt install docker.io # 安装 Docker Compose sudo apt install docker-compose1.2 查看服务器架构选择正确的镜像bashlscpu | grep Architecture # 输出 x86_64 → 对应 linux-x641.3 创建项目目录bashmkdir -p /data/MyPortfolio cd /data/MyPortfolio二、准备项目文件2.1 目录结构text/data/MyPortfolio/ ├── docker-compose.yml ├── backend/ │ ├── Dockerfile │ └── publish/ # dotnet publish 发布文件 ├── frontend/ │ ├── Dockerfile │ ├── default.conf # Nginx 配置 │ └── dist/ # npm run build 构建产物2.2 构建后端发布文件本地或服务器上bash# 在项目根目录执行 dotnet publish -c Release -o ./publish然后将publish文件夹上传到/data/MyPortfolio/backend/。2.3 构建前端产物bashnpm run build将dist文件夹上传到/data/MyPortfolio/frontend/。三、核心配置文件3.1 后端 Dockerfile/data/MyPortfolio/backend/DockerfiledockerfileFROM mcr.microsoft.com/dotnet/aspnet:8.0 AS base WORKDIR /app EXPOSE 8000 FROM base AS final WORKDIR /app COPY ./publish . ENTRYPOINT [dotnet, Portfolio.Api.dll] # 替换为你的项目名3.2 前端 Nginx 配置/data/MyPortfolio/frontend/default.conf注意proxy_pass中的backend是docker-compose.yml中定义的后端服务名Docker内部DNS会自动解析。nginxserver { listen 80; server_name your_domain_or_ip; # 允许上传最大 100MB 的文件解决 413 错误 client_max_body_size 100M; root /usr/share/nginx/html; index index.html; # Vue Router 支持刷新页面不404 location / { try_files $uri $uri/ /index.html; } # API 请求代理到后端容器 location ^~/api/ { proxy_pass http://backend:8000/api/; 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; } }3.3 前端 Dockerfile/data/MyPortfolio/frontend/DockerfiledockerfileFROM nginx:alpine COPY default.conf /etc/nginx/conf.d/default.conf COPY dist /usr/share/nginx/html EXPOSE 803.4 Docker Compose 编排/data/MyPortfolio/docker-compose.ymlyamlversion: 3.8 services: backend: build: context: ./backend dockerfile: Dockerfile container_name: portfolio-backend environment: - ASPNETCORE_URLShttp://:8000 # 数据库连接字符串请替换为实际信息 - ConnectionStrings__DefaultConnectionServeryour_db_host;Port3306;Databaseyour_db;Useryour_user;Passwordyour_password; restart: always frontend: build: context: ./frontend dockerfile: Dockerfile container_name: portfolio-frontend ports: - 8888:80 depends_on: - backend restart: always四、部署过程中遇到的问题与解决4.1 镜像拉取失败DNS / 网络超时报错信息textfailed to resolve reference docker.io/library/nginx:alpine: dial tcp: lookup docker.mirrors.ustc.edu.cn on 127.0.0.53:53: no such host原因分析服务器 DNS 解析有问题127.0.0.53无法解析镜像源域名配置的镜像加速器中科大源已失效解决方案临时直接修改系统 DNS并清空 Docker 镜像加速器。bash# 修改系统 DNS sudo systemctl stop systemd-resolved sudo systemctl disable systemd-resolved sudo rm -f /etc/resolv.conf sudo bash -c echo nameserver 8.8.8.8 /etc/resolv.conf sudo bash -c echo nameserver 114.114.114.114 /etc/resolv.conf # 修改 Docker 配置 sudo nano /etc/docker/daemon.json写入json{ registry-mirrors: [], dns: [8.8.8.8, 114.114.114.114] }重启 Dockerbashsudo systemctl daemon-reload sudo systemctl restart docker如果还是拉取失败可以手动导入镜像bash# 在能联网的机器上 docker pull nginx:alpine docker save nginx:alpine -o nginx-alpine.tar # 上传到服务器后 docker load -i nginx-alpine.tar4.2 上传文件报 413 Request Entity Too Large原因Nginx 默认client_max_body_size为 1MB。解决方案在default.conf的server块中添加nginxclient_max_body_size 100M;然后重新构建前端镜像并重启bashsudo docker-compose build --no-cache frontend sudo docker-compose up -d4.3 Docker Compose 启动报错KeyError: ContainerConfig报错信息textKeyError: ContainerConfig原因Docker Compose 版本较旧1.29.2或容器元数据损坏。解决方案bash# 彻底清理 sudo docker-compose down --volumes --remove-orphans # 重新构建并启动 sudo docker-compose up -d这个小技巧建议收藏遇到奇奇怪怪的容器启动问题时特别好用。4.4 Favicon 图标不更新现象部署新项目后浏览器标签页还是显示旧项目的图标。原因浏览器独立缓存了favicon.ico清除页面缓存无效。解决方案硬刷新Ctrl F5Windows或Cmd Shift RMac或使用无痕模式验证永久解决在index.html中给图标加版本号htmllink relicon href/favicon.ico?v2 /五、常用运维命令5.1 查看容器状态bashsudo docker ps5.2 查看容器日志bash# 查看后端日志 sudo docker logs -f portfolio-backend # 查看前端日志 sudo docker logs -f portfolio-frontend5.3 进入容器调试bash# 进入前端容器 sudo docker exec -it portfolio-frontend /bin/sh # 进入后端容器 sudo docker exec -it portfolio-backend /bin/bash5.4 停止并清理bashsudo docker-compose down sudo docker-compose down --volumes --remove-orphans # 完全清理5.5 重启服务bashsudo docker-compose restart六、小结这次部署不算复杂但踩的坑都挺典型的。总结几点经验国内服务器一定要配好DNS和镜像源不然拉取镜像能卡半天。建议直接用阿里云或网易的镜像加速器中科大的源现在不太稳定。Nginx 的client_max_body_size要记得配否则文件上传超1MB就报413排查起来容易被忽略。遇到容器启动报KeyError先docker-compose down --volumes --remove-orphans再重新up能解决大部分元数据问题。前端用相对路径/api/xxx请求配合Nginx反向代理可以避免跨域问题部署也更灵活。图标缓存问题加?v版本号是最高效的解决方式。整个部署流程跑通后后续更新就很简单了本地修改代码 →publish/build→ 上传替换文件 →docker-compose build --no-cache→docker-compose up -d。一次配置长期受益。相关资源Docker 官方文档Nginx 配置文档ASP.NET Core Docker 部署文档希望这篇博客能帮到正在折腾Docker部署的你。如果遇到问题欢迎在评论区留言交流