上传源代码

将vite-ssr-blog目录上传至服务器或通过Git工具从码云或者Github上拉取到服务器上，但前提需要安装Git工具，上传前删除目录下的node_modules,因为node_modules目录里面的文件太大，上传上去也没有必要上传上去后进入。

修改配置

此项操作在将文件上传到服务器前也可以先进行修改
进入vite-ssr-blog根目录，并修改.env.production，以下是.env.production的内容

#正式环境使用的环境变量

# 默认网站名称
VITE_SITE_NAME = "可乐不加冰"

# 站点启动端口
PORT = 5200

# 博客Api接口地址
VITE_BASE_API_URL = "http://172.17.0.1:8066"
bash

根据自己的部署情况修改上面三项

创建镜像

修改配置后就可以创建Docker镜像了

# 命令解释：docker build -t 镜像名 .
docker build -t blog.ssr .
bash

启动镜像

docker run -d -p 5200:5200 --restart always  --name blog.ssr blog.ssr
bash

执行成功后结果如下

容器启动后可以通过IP加端口进行访问。

Nginx配置

server {
        listen       80;
        # 替换为你自己的域名
        server_name www.okay123.top okay123.top;
        rewrite ^(.*)$  https://$host$1 permanent;

    }
# 启用https 证书可以在腾讯云或者阿里云申请免费的
server {
        listen 443 ssl;
        # 下面域名替换为你自己的域名
        server_name www.okay123.top okay123.top;
        # 证书所在路径（绝对路径）
        ssl_certificate /home/cert/okay123.top/okay123.top_bundle.crt;
        ssl_certificate_key /home/cert/okay123.top/okay123.top.key;
        ssl_session_timeout 5m;
        ssl_protocols TLSv1.2 TLSv1.3;
        ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:HIGH:!aNULL:!MD5:!RC4:!DHE;
        ssl_prefer_server_ciphers on;
        location / {
             proxy_set_header Referer $host;
             proxy_set_header X-Real-IP $remote_addr;
             proxy_set_header Host $host;
             proxy_set_header Cookie $http_cookie;
             proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
             # 博客容器访问的地址和端口（上文中博客容器端口为5200）
             proxy_pass http://127.0.0.1:5200;
            #index  index.html;
            #try_files $uri $uri/ /index.html;
        }

        location /blog/ {
             proxy_set_header Referer $host;
             proxy_set_header X-Real-IP $remote_addr;
             proxy_set_header Host $host;
                         #proxy_set_header Cookie $http_cookie;
             proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
	     # 你的API接口地址
             proxy_pass http://127.0.0.1:8066/api/;
        }
        location /api {
             proxy_set_header Referer $host;
             proxy_set_header X-Real-IP $remote_addr;
             proxy_set_header Host $host;
             #proxy_set_header Cookie $http_cookie;
             proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
	     # 你的API接口地址
             proxy_pass http://127.0.0.1:8066;
        }


        #开启gzip
        gzip  on;
        #低于1kb的资源不压缩
        gzip_min_length 1k;
        #压缩级别1-9，越大压缩率越高，同时消耗cpu资源也越多，建议设置在5左右。
        gzip_comp_level 5;
        #需要压缩哪些响应类型的资源，多个空格隔开。不建议压缩图片.
        gzip_types text/plain application/javascript application/x-javascript text/javascript text/xml text/css font/woff2 font/woff font/ttf;
        #配置禁用gzip条件，支持正则。此处表示ie6及以下不启用gzip（因为ie低版本不支持）
        gzip_disable "MSIE [1-6]\.";
        #是否添加“Vary: Accept-Encoding”响应头
        gzip_vary on;
}

json

自动化部署

以下是Linux下的部署脚本，脚本执行前需要对脚本设置权限，比喻脚本名叫"blog.ssr.sh",请执行：chmod 777 blog.ssr.sh
使用此脚本需提前安装好Git工具

#!/bin/bash
# 判断文件夹是否存在
if [ -d "/home/code/" ];then
  echo "文件夹已经存在"
  cd /home/code
  echo "更新代码..."
  git pull
  else
   mkdir /home/code
  echo "拉取代码..."
# 请将https://gitee.com/miss_you/easy-admin.git替换为自己的源代码地址
  git clone  https://gitee.com/miss_you/easy-admin.git /home/code/
fi

echo "获取当前容器是否存在"
containerps=$(docker ps -f name=blog.ssr -q)
containerstop=$(docker ps -a -f name=blog.ssr -q)
for alpha in "$containerps";do
    if [ "$alpha" == "" ];then
    echo "检查是否存在停止的容器"
        for alpha1 in "$containerstop";do
          if [ "$alpha1" == "" ];then
          echo "不存指定容器"
          else
          echo "存在停止了的 然后直接删除-----------开始------------------"
          docker rm $alpha1
          echo "存在停止了的 然后直接删除-----------完成------------------"
        fi
       done
    else
    echo "存在-停止运行 然后删除----------------------开始-----------------"
    docker stop $alpha
    docker rm $alpha
     echo "存在-停止运行 然后删除---------------------完成------------------"
    fi
done

echo "获取当前镜像是否存在-----------------------------------------------------------------"
dockerlist=$(docker images blog.ssr:latest -q)
for alpha2 in "$dockerlist";do
  if [ "$alpha2" == "" ];then
     echo "不存在指定镜像-------------------------------------------------" 
  else
       echo "存在当前指定的镜像 删除镜像--------------开始-----------------------------------"
      docker rmi $alpha2
     echo "存在当前指定的镜像 删除镜像--------------完成-----------------------------------"
  fi
done


cd /home/code/src/frontend/vite-ssr-blog/

echo "--------生成镜像----------"
docker build -t blog.ssr .

echo --------------挂载配置文件以及上传目录以及日志目录----------------
docker run -d -p 5200:5200 --restart always  --name blog.ssr blog.ssr

bash