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里面，如下圖：
然后瀏覽器訪問即可，如下圖：
