当前位置:首页 > 编程笔记 > 正文
已解决

Ubuntu系统下使用docker容器配置nginx并部署前端项目

来自网友在路上 161861提问 提问时间:2023-10-25 14:46:24阅读次数: 61

最佳答案 问答题库618位专家为你答疑解惑

1.下载 Nginx 镜像

命令 描述

docker pull nginx	下载最新版 Nginx 镜像`  :

2. 创建要挂载的宿主机目录

启动前需要先创建 Nginx 外部挂载的配置文件( /home/nginx/conf/nginx.conf)
之所以要先创建 , 是因为 Nginx 本身容器只存在 / etc/nginx 目录 , 本身就不创建 nginx.conf 文件
当服务器和容器都不存在 nginx.conf 文件时, 执行启动命令的时候 docker 会将 nginx.conf 作为目录创建 , 这并不是我们想要的结果 。

> mkdir -p /home/nginx/conf
> 
> mkdir -p /home/nginx/log
> 
> mkdir -p /home/nginx/html

3.容器中的 nginx.conf 文件和 conf.d 文件夹复制到宿主机

# 生成容器
docker run --name nginx -p 80:80 -d nginx
# 将容器nginx.conf文件复制到宿主机
docker cp nginx:/etc/nginx/nginx.conf /home/nginx/conf/nginx.conf
# 将容器conf.d文件夹下内容复制到宿主机
docker cp nginx:/etc/nginx/conf.d /home/nginx/conf/conf.d
# 将容器中的html文件夹复制到宿主机
docker cp nginx:/usr/share/nginx/html /home/nginx/

此时会发现宿主机(也就是本机电脑)上的/home/nginx/conf,/home/nginx/log,/home/nginx/html这三个文件夹下已经有容器内的配置文件了

4、创建 Nginx 容器并运行

#停止容器
docker stop nginx
# 删除该容器
docker rm nginx

5.启动容器,并正式挂载对应文件

docker run \
-p 80:80 \
--name nginx \
-v /home/nginx/conf/nginx.conf:/etc/nginx/nginx.conf \
-v /home/nginx/conf/conf.d:/etc/nginx/conf.d \
-v /home/nginx/log:/var/log/nginx \
-v /home/nginx/html:/usr/share/nginx/html \
-d nginx

然后基础配置已经完成,在地址栏输入localhost:80端口测试一下,表示已经成功安

在这里插入图片描述

当然,我们为了让用户更加便捷,我们增加了图片拖拽功能。

现在开始配置静态资源路径,保证能够代理到我们想要的静态页面

1.先把我们打包好的前端项目文件(sky)放到指定的文件夹目录下,这里我放到了 本机的/home/nginx/html文件下,对应容器里的/usr/share/nginx/html/sky路径

本机:

  • home
    –nginx
    – html
    —sky

容器内:

  • usr
  • –share
    –nginx
    – html
    —sky

2.然后在/home/nginx/conf/conf.d的

defalult.conf

这个默认配置文件中配置自定义静态资源路径,一定要在默认里配置,我试了一下只在nginx.conf文件里配置是不行的

server {listen       80;server_name  localhost;location / {#这里指的是自己前端项目存放路径(容器里的路径,不是本机)root   /usr/share/nginx/html/sky;index  index.html index.htm;}

每次更改配置文件一定要重启docker里的nginx服务
配置完成之后在地址栏输入localhost:80端口可访问到我们自己项目登录页面

在这里插入图片描述

3.配置反向代理来跟后端tomcat服务器相连接,来保证登录进入系统,同样在default.conf文件里配置,注意下面的地址不能写localhost,如果写localhost指的是容器里的本机地址,下面地址要换成宿主机,也就是现在本机的IP地址(默认后端服务器运行在8080端口下)

# 反向代理,处理管理端发送的请求location /api/ {proxy_pass   http://192.168.1.102:8080/admin/;#proxy_pass   http://webservers/admin/;}

每次更改配置文件一定要重启docker里的nginx服务

5.启动后端服务器

在这里插入图片描述

6.点击前台页面登录按钮

在这里插入图片描述
在这里插入图片描述

成功登录进入系统,表示前后端联调成功,项目部署完毕。

查看全文

99%的人还看了

猜你感兴趣

版权申明

本文"Ubuntu系统下使用docker容器配置nginx并部署前端项目":http://eshow365.cn/6-24210-0.html 内容来自互联网,请自行判断内容的正确性。如有侵权请联系我们,立即删除!