1.简介
简单记录一下docker搭建部署前端的流程
2.操作
(1) 拉取nginx镜像：
docker pull nginx
(2) 运行docker镜像：
docker run --name nginx-test -p 8080:80 -p 443:443 -v /home/nginx/html:/usr/share/nginx/html -d nginx--name nginx-test：容器名称（自定义的）
-p 8080:80：端口进行映射，将本地 8080 端口映射到容器内部的 80 端口。
-d nginx：设置nginx容器在后台一直运行
-v：/home/nginx/html 这是服务器中的目录映射到nginx容器中的/usr/share/nginx/html中,大概意思就是两个是一个双向绑定的关系，映射后服务器中的目录内容改变nginx容器中的也会变，反之相同
(3) 查看容器
命令:
docker ps
1663232854731.png
(4) 把nginx容器/etc/nginx中的配置文件拷贝到服务器/home/nginx/conf中：
docker cp 容器id:/etc/nginx /home/nginx/conf
(5) 删除前面运行的容器
停止:
docker stop nginx-test
删除:docker rm nginx-test
(6) 重新运行nginx镜像
docker run --name nginx-test -p 8080:80 -p 443:443 -v /home/nginx/html:/usr/share/nginx/html -v /home/nginx/conf:/etc/nginx -d nginx
值得注意的两个点：
一个是nginx镜像中的：/usr/share/nginx/html，这个目录是用于放具体的前端项目的，我们将它映射到你的服务器中的这个目录: /home/nginx/html；还有一个是nginx镜像中的： /etc/nginx，这个目录里面有nginx的配置文件，咱们映射到服务器：/home/nginx/conf里面。映射了这个目录以后，修改nginx的配置文件就可以不用再到容器里面了，可以直接到服务器的/home/nginx/conf里面去修改nginx的配置文件。
(7) 如何修改nginx的配置文件
cd /home/nginx/conf/conf.d
到这个目录下，我们可以看到一个: default.conf，这个文件就是配置nginx的关键文件
#api
server {
#listen 80; #侦听80端口
listen 8443 ssl; #侦听443端口，用于SSL
server_name www.xxxxx.com; # 自己的域名
# 注意证书文件名字和位置，是从/etc/nginx/下开始算起的也就是我们自己服务器/home/nginx/conf下，cert
#是自己新建的放证书的文件夹
ssl_certificate cert/xxxxxxx.pem;
ssl_certificate_key cert/xxxxxxxx.key;
ssl_session_timeout 5m;
ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:HIGH:!aNULL:!MD5:!RC4:!DHE;
ssl_prefer_server_ciphers on;
client_max_body_size 1024m;
location / {
proxy_set_header HOST $host;
proxy_set_header X-Forwarded-Proto $scheme;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
# enables WS support
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";
# 这里写的是我的阿里云内网地址,不知道为啥,不能用127.0.0.1...
proxy_pass http://xxxxxxxx:8081;
}
}
#h5
server {
listen 80; #侦听80端口
listen 443 ssl; #侦听443端口，用于SSL
server_name xxxxxx.com; # 自己的域名
# 注意证书文件名字和位置，是从/etc/nginx/下开始算起的
ssl_certificate cert/xxxxxxx.pem;
ssl_certificate_key cert/xxxxx.key;
ssl_session_timeout 5m;
ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:HIGH:!aNULL:!MD5:!RC4:!DHE;
ssl_prefer_server_ciphers on;
client_max_body_size 1024m;
location / {
root /usr/share/nginx/html;
index index.html index.htm;
}
}
然后把文件传到：/home/nginx/html里面，如下图：
然后浏览器访问即可，如下图：
