1Panel面板快速部署Mix-Space

Mix Space 是一个一款简洁而不简单的个人博客系统，它够快，够现代。你可以利用它构建一个属于自己的个人空间，记录生活，分享知识。

Step.0 开端#

其实我在更换 Mix-Space 之前，是在用 Hexo 作为个人主力博客系统的。不过 Hexo 虽好，它轻量，快速，完全静态，但它配置不统一和撰写文章略麻烦的问题一直困扰着我。在斟酌以后我决定更换一套博客系统。
最开始的选择是 VanBlog，它后端使用便捷，前端基本静态，前后端分离的设计看起来很不错，但我在实际上手使用后，却发现存在各种影响我使用的小问题，比如：

评论系统使用内置 Waline，但其配置并不完善，而且内部 iFrame 反代其管理页面也经常出一些莫名其妙的问题
友链和捐赠信息使用的变量表可编辑性较低
页面略显陈旧，且部分页面（如友链）响应性一般

这可能和它正处于开发阶段也多少有点关系，不过我还是决定再寻找适合我的博客系统。

然后我便看到了 Shiro（其实很早以前就看到过一点，但当时觉得用 Hexo 也行便没深入研究），仔细研究下 Shiro 和其后端 Mix-Space 后发现似乎挺合我需求的。

而且我还可以把 Shiro 部署到 Vercel 或者 Netlify 这样的 Serverless 平台，能保证一定速度的情况下还能减少服务器压力，这还是挺不错的感觉？

Step.1 部署后端#

如标题所言，我使用的服务器管理面板是 1Panel，这是一个开源且快速的服务器管理面板，相比宝塔来说更符合我的使用习惯，作为开源也不大担心植入监视或者后门问题，而且其容器化特性也使得服务器应用运行更加安全。

在 1Panel 上，一般建议应用都使用 Docker 容器化部署，方便管理也方便安装与卸载。

我使用了 Mix-Space 官方建议的 Docker Compose 部署方式，不过我在其上面做了点小小的修改来使得其更加符合我的需求。

我使用的 Docker Compose 文件如下，相对来说更加符合 1Panel 的使用，仅供参考。


version: '3.8'

services:
  app:
    container_name: Mx-Space
    image: innei/mx-server:5
    command: bash ./docker-run.sh
    environment:
      - TZ=Asia/Shanghai
      - NODE_ENV=production
      - ALLOWED_ORIGINS
      - JWT_SECRET
      - ENCRYPT_KEY
      - ENCRYPT_ENABLE

    volumes:
      - ./data/mx-space:/root/.mx-space
    ports:
      - '127.0.0.1:2333:2333'
    depends_on:
      - mongo
      - redis
    links:
      - mongo
      - redis
    networks:
      - 1panel-network
    restart: always
    healthcheck:
      test: ['CMD', 'curl', '-f', 'http://127.0.0.1:2333/api/v2/ping']
      interval: 1m30s
      timeout: 30s
      retries: 5
      start_period: 30s

  mongo:
    container_name: mongo
    image: mongo
    volumes:
      - ./data/db:/data/db
    ports:
      - "127.0.0.1:27017:27017"
    networks:
      - 1panel-network
    restart: always

  redis:
    container_name: redis
    image: docker.dragonflydb.io/dragonflydb/dragonfly
    networks:
      - 1panel-network
    ulimits:
      memlock: -1
    ports:
      - "127.0.0.1:6379:6379"
    volumes:
      - ./data/redis:/data

networks:
  1panel-network:
    external: true

我相比 MIx-Space 官方 Compose 文件做出的修改如下：

Docker 网络更换为 1Panel 的1panel-networkDocker 网络，在做反代和与 1Panel 其他服务联动上更加便捷一些
Core 后端地址由0.0.0.0:2333更换为127.0.0.1:2333，仅在服务器内网广播，更安全
Redis 数据库服务替换为 DragonflyDB，这是一个兼容 Redis 的数据库服务，其官方文档称读写效率是 Redis 的 20 倍，且并发能力更强，如果你不喜欢这个也可以对比 Mix-Space 官方文档自行替换为标准 Redis 服务。

启动服务#

启动服务事情也简单，我们不需要另行安装 Docker 与 Docker Compose 服务，因为 1Panel 面板在安装时已经预置了这些服务，我们仅需按照 Mix-Space 官方文档中写的新建目录：

cd && mkdir -p mx-space/core && cd $_ 

# 拉取我修改过的docker-compose.yml文件
wget https://fastly.jsdelivr.net/gh/yzsong06/File@main/Mix-Space/docker-compose.yml

`.env`文件#

# JWT 密钥：需要填写长度不小于 16 个字符，不大于 32 个字符的字符串，用于加密用户的 JWT，务必保存好自己的密钥，不要泄露给他人。
JWT_SECRET=
# 被允许的域名：需要填写被允许的域名，通常是前端的域名，如果允许多个域名访问，用英文逗号，分隔。
ALLOWED_ORIGINS=
# 是否开启加密：如果你确定要开启加密，将 false 改为 true，开启加密后，你需要在下方填写加密密钥。
ENCRYPT_ENABLE=
# 加密密钥：如果你不知道这是什么，那么不建议开启此功能，具体内容可参考 https://mx-space.js.org/usage/security.html
ENCRYPT_KEY=
# 若开启加密，则需注意密钥长度必须为 64 位，不然会在初始化时报错。注意这是不可逆的，务必保存自己的秘钥。所以并不是非常推荐使用，除非你真的需要加密，

接下来打开我们放置docker-compose.yml的目录（一般是服务器的 /root/mx-space/core），并新建.env文件并把以上参数粘贴到其中，然后按需修改你所需要修改的值，注意直接在等号后面写值即可，不需要空格。

然后回到终端输入以下命令（请注意执行以下命令的时候你要在服务器 root 目录下，你也可以拆开执行以下命令）

cd mx-space/core && docker compose up -d

这样会开始拉取并新建 Docker 容器，等待拉取新建完成后服务会自动启动，这样我们就完成了后端的启动配置

Step.2 配置反代#

非强制配置，个人测试未配置反向代理程序依旧工作正常

在 1Panel 上配置反代跟宝塔差不多，毕竟有可视化的管理面板，还是比较方便的。

我们进入 1Panel 的网站中（需要先安装 Openresty），然后新建网站，选择反向代理，域名填写你想要的后端域名，反代地址填写127.0.0.1:2333，然后新建网站就会启动反代服务了，此时我们还需要一点小小的配置来让它更好的工作。

我们进入对应网站服务的配置中，找到配置文件，在配置文件里按照 Mix-Space 官方文档里写的添加反代配置，里面应该是已经有 Server 头了，所以我们添加以下内容：


    location /socket.io {
      proxy_pass http://127.0.0.1:2333/socket.io; 
      proxy_set_header Host $host; 
      proxy_set_header X-Real-IP $remote_addr; 
      proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; 
      proxy_set_header REMOTE-HOST $remote_addr; 
      proxy_set_header Upgrade $http_upgrade; 
      proxy_set_header Connection "upgrade"; 
      proxy_buffering off;
      proxy_http_version 1.1; 
      add_header Cache-Control no-cache; 
    }
   
   location / {
      proxy_pass http://127.0.0.1:2333; 
      proxy_set_header Host $host; 
      proxy_set_header X-Real-IP $remote_addr; 
      proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; 
      proxy_set_header REMOTE-HOST $remote_addr; 
      add_header X-Cache $upstream_cache_status; 
    }

完成后选择保存并重载，然后在面板上配置好Https后访问你的后端域名（{域名}/proxy/qaqdmin）即可看到管理面板。

Step.3 配置主题#

这里不再详述配置前端主题过程，具体可参考官方文档