> 技术文档 > Docker 安装和配置 Nginx 详细图文教程_docker nginx

Docker 安装和配置 Nginx 详细图文教程_docker nginx


🚀 作者主页: 有来技术
🔥 开源项目: youlai-mall ︱vue3-element-admin︱youlai-boot︱vue-uniapp-template
🌺 仓库主页: GitCode︱ Gitee ︱ Github
💖 欢迎点赞 👍 收藏 ⭐评论 📝 如有错误敬请纠正!

目录

  • 1. 环境准备
  • 2. 创建挂载目录
  • 3. 编写 Nginx 配置文件
  • 4. 拉取 Nginx 容器
  • 5. 启动 Nginx 容器
  • 6. 验证安装
  • 7. 配置 SSL(可选)
  • 8. 结语

Nginx 是一款高性能的 Web 服务器和反向代理服务器,广泛用于处理高并发的 Web 流量。在这篇文章中,通过 Docker 快速安装并配置 Nginx。

1. 环境准备

首先,确保你的系统已安装 Docker。如果尚未安装 Docker,请参考相关文档进行安装:

  • Linux (CentOS 9) 安装 Docker
  • Linux (CentOS 8) 安装 Docker
  • Windows 安装 Docker

2. 创建挂载目录

在安装和配置 Nginx 之前,首先需要创建一些目录,用于存放 Nginx 配置文件、网页文件、日志文件和 SSL 证书等。

sudo mkdir -p /mnt/nginx/{conf.d,html,logs,ssl}
目录路径 核心用途 /mnt/nginx/conf 存放自定义配置文件
(如虚拟主机配置) /mnt/nginx/html 网站静态资源
(HTML/CSS/JS/图片) /mnt/nginx/logs 存储访问日志/错误日志
(access.log, error.log) /mnt/nginx/ssl HTTPS证书文件
(.crt, .key, .pem)

3. 编写 Nginx 配置文件

/mnt/nginx/nginx.conf 目录下创建一个自定义的 Nginx 配置文件,执行以下命令:

sudo touch /mnt/nginx/nginx.conf

接下来,使用以下配置来部署 vue3-element-admin 项目的前端应用,并代理后端 API:

worker_processes 1;events { worker_connections 1024;}http { include mime.types; default_type application/octet-stream; sendfile on; keepalive_timeout 65; # 开启gzip gzip on; gzip_http_version 1.1; gzip_disable \"MSIE [1-6]\\.\"; gzip_min_length 1k; gzip_buffers 16 64k; gzip_comp_level 5; gzip_vary on; gzip_types text/plain application/javascript text/css; server { listen 80; server_name localhost; location / { # 指定前端静态资源路径 # 需将 vue3-element-admin 项目构建后的 dist 目录拷贝至 /usr/share/nginx/html/vue root /usr/share/nginx/html/vue; index index.html index.htm; } # 代理后端 API 请求 location /prod-api/ { proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; # 后端服务地址,注意保留 URL 末尾的 `/` proxy_pass https://api.youlai.tech/; } }}

4. 拉取 Nginx 容器

docker pull nginx

5. 启动 Nginx 容器

使用以下命令在 Docker 中启动 Nginx 容器,并挂载自定义配置文件和网页文件:

docker run -it -d --restart always --network host \\ --name nginx \\ -v /mnt/nginx/nginx.conf:/etc/nginx/nginx.conf \\ -v /mnt/nginx/html:/usr/share/nginx/html \\ -v /mnt/nginx/logs:/var/log/nginx/ \\ -v /mnt/nginx/ssl:/etc/nginx/ssl \\ nginx
参数 功能说明 --network host 网络模式 --name nginx 容器命名 -v [宿主机路径]:[容器路径] 数据卷挂载 /mnt/nginx/nginx.conf:/etc/nginx/nginx.conf 挂载主配置文件 /mnt/nginx/html:/usr/share/nginx/html 挂载网站文件 /mnt/nginx/logs:/var/log/nginx/ 持久化存储日志 /mnt/nginx/ssl:/etc/nginx/ssl 挂载SSL证书

Docker 安装和配置 Nginx 详细图文教程_docker nginx

6. 验证安装

Docker 安装和配置 Nginx 详细图文教程_docker nginx

7. 配置 SSL(可选)

如果您需要启用 HTTPS,可以通过 阿里云数字证书管理 申请免费的 SSL 证书。申请完成后,下载适用于 Nginx 服务器的证书文件。
Docker 安装和配置 Nginx 详细图文教程_docker nginx

下载后,解压并将 SSL 证书放置到 /mnt/nginx/ssl 目录下。

接下来,在 Nginx 配置文件 nginx.conf 中添加以下配置来启用 HTTPS:

server { listen 443 ssl; server_name vue.youlai.tech; # 配置 SSL 证书路径 ssl_certificate ssl/vue.youlai.tech.pem; ssl_certificate_key ssl/vue.youlai.tech.key; location / { root /usr/share/nginx/html/vue; index index.html index.htm; } # 设置反向代理接口 location /prod-api/ { proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; # 后端服务地址,注意保留 URL 末尾的 `/` proxy_pass https://api.youlai.tech/; }}

确保 SSL 证书的路径设置正确,并且 Nginx 配置无误。完成配置后,重新加载 Nginx 以使更改生效:

docker exec -it nginx nginx -s reload

8. 结语

通过 Docker 快速搭建并配置 Nginx 服务,可以极大地简化部署过程,并使得管理和维护更加高效。希望本文能帮助你在生产环境中顺利运行 Nginx,并通过合理配置优化其性能和安全性。