为什么要把conf目录和静态资源目录配置出来(这里指开发调试阶段,生产阶段要将配置和资源COPY到Nginx容器中)
在开发调试的过程中,经常需要频繁的更改配置文件和打包的前端web文件,这样的话,如果是使用Dockerfile中COPY命令上传相关文件的话,需要反复构建镜像,并重新生成容器,比较麻烦。如果能够将相关需要配置的文件和前端web文件映射到宿主机上进行配置,这样只需要重启容器就可以解决问题了。
第一步 需要运行一个Nginx容器,并导出下一步需要的配置文件
- 启动一个空的Nginx容器 :
docker run -d --name nginx-demo nginx
- 检查容器是否运行成功:
docker ps
第二步 导出配置文件
- 将需要的配置文件从容器中导出,导出到工作目录(后期需要挂载的目录),工作目录 /Users/sone/ngx-web2,在工作目录下,创建需要的目录文件夹
1.conf 是存放nginx配置文件的
2.html是存放web静态资源的
3.logs是映射nginx运行日志的(access.log,error.log)
- 拷贝容器内nginx默认配置文件到工作目录中的相关文件夹中
docker cp nginx-demo:/etc/nginx/nginx.conf $PWD/conf
docker cp nginx-demo:/etc/nginx/conf.d $PWD/conf
进入容器找到需要的配置文件和文件夹,使用docker cp命令将其拷贝到之前准备的conf文件夹中
- 完成拷贝后,停止容器并将其删除
1.停止容器
docker stop nginx-demo
2.删除容器
docker rm nginx-demo
第三步 创建Nginx容器
docker run -d -p 80:80 \
--name nginx-demo \
-v /Users/sone/ngx-web2/html:/usr/share/nginx/html \
-v /Users/sone/ngx-web2/conf/nginx.conf:/etc/nginx/nginx.conf \
-v /Users/sone/ngx-web2/conf/conf.d:/etc/nginx/conf.d \
-v /Users/sone/ngx-web2/logs:/var/log/nginx \
nginx
参数说明:
-d 表示容器在后台运行,防止退出容器后,容器被停止或删除
-p 80:80 映射本机8080端口到容器的80端口
--name nginx-demo 设置容器名称为nginx-demo
-v 将本地文件挂载到容器的指定目录
第四部 配置nginx.conf
user nginx;
worker_processes auto;
error_log /var/log/nginx/error.log notice;
pid /var/run/nginx.pid;
events {
worker_connections 1024;
}
http {
include /etc/nginx/mime.types;
default_type application/octet-stream;
log_format main '$remote_addr - $remote_user [$time_local] "$request" '
'$status $body_bytes_sent "$http_referer" '
'"$http_user_agent" "$http_x_forwarded_for"';
access_log /var/log/nginx/access.log main;
sendfile on;
#tcp_nopush on;
keepalive_timeout 65;
#gzip on;
include /etc/nginx/conf.d/*.conf;
server {
listen 80;
server_name localhost;
location / {
root html;
index index.html index.htm;
}
#error_page 404 /404.html;
# redirect server error pages to the static page /50x.html
#
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root html;
}
location /app/ { # 映射访问url,到静态资源文件下
alias /usr/share/nginx/html/app/dist;
index index.html index.htm;
}
}
}
将前端web打包的内容放到html/app/dist下(这里自己测试放的有点复杂了,也可以根据自己需要配置nginx.conf中的location进行简化)
配置完成后需要重启nginx容器
docker stop nginx-demo # 先停止nginx-demo容器
docker start nginx-demo # 在启动nginx-demo容器
第五步 访问测试
在浏览器中输入地址: http://localhost:8080/app/dist/item.html
访问效果:
到此完成!感谢观看!