docker-compose 配置nginx

前言

前端打包的dist文件在宿主机,nginx运行在docker-compose

问题

nginx.conf 在本地配置可以生效,但是链接到容器就报错

基于本地的nginx运行,本地nginx.conf 如下

复制代码
server {
    listen 8081;
    location / {
        root /usr/local/software/testweb/dist; # 指向你的Vue应用解压后的目录,宿主机目录
        try_files $uri $uri/ /index.html; # 尝试直接找到文件,如果找不到则回退到index.html(Vue路由需要)
    }

}

基于容器运行,映射到容器的nginx.conf配置如下

复制代码
server {
    listen 80;
    root /usr/share/nginx/html; #容器内的地址
    location / {
        try_files $uri $uri/ /index.html; # 尝试直接找到文件,如果找不到则回退到index.html(Vue路由需要)
    }

}

容器内部目录截图如下

容器的docker-compose配置如下

复制代码
version: '3.8'
services:
  nginx:
    image: nginx:latest
    ports:
    volumes:
      - /usr/local/software/dist:/usr/share/nginx/html 
这里是将前面的本地dist路径,挂载到容器,然后上面的nginx.conf 的 root /usr/share/nginx/html; 容器内的地址,才会生效
相关推荐
Anarkh_Lee1 小时前
别再手写 conf 了!NgxFlow:基于 React Flow 的 Nginx 可视化与调试神器
前端·nginx·数据可视化
菜鸟思维1 小时前
优化NextJs 项目的Docker 镜像 从3.62G 优化到 296.85M
docker
怣疯knight1 小时前
Docker Desktop 4.55.0版本安装成功教程
windows·docker
Run Out Of Brain1 小时前
解决nginx代理配置下wordpress的 /wp-admin/返回 302 重定向到登录页问题
运维·nginx
放寒假脚后跟v2 小时前
Pod 的 YAML 文件中 exitCode 字段的具体含义、不同取值代表的场景
运维·云原生·容器·kubernetes·k8s
东方佑2 小时前
使用Docker Compose一键部署OnlyOffice:完整指南与配置解析
运维·docker·容器
原神启动12 小时前
K8S(五)—— YAML文件解析
java·容器·kubernetes
lin张2 小时前
k8s(二)项目生命周期管理、发布策略与声明式资源管理
云原生·容器·kubernetes
赵文宇(温玉)2 小时前
Docker的价值、特点、创新与关键技术
运维·docker·容器
Zsr10233 小时前
K8S安装指南与核心操作命令汇总
云原生·容器·kubernetes