Shiro部署教程(备忘)

2024 年 10 月 24 日 星期四(已编辑)
/
102

Shiro部署教程(备忘)

1.部署Core

1.必要的准备

  • 域名
  • 域名所需ssl证书，需要开启全站https

  • 提示，如果需要多个域名访问一个前端，则需要在docker-compse里加上localhost,127.0.0.1

    一.安装Docker

    首先，安装一些必要的软件包：

    apt update
apt upgrade -y
apt install curl vim wget gnupg dpkg apt-transport-https lsb-release ca-certificates
    然后加入 Docker 的 GPG 公钥和 apt 源： 
    apt update
apt upgrade -y
apt install curl vim wget gnupg dpkg apt-transport-https lsb-release ca-certificates
    国内机器可以用清华 TUNA 的国内源： 
    curl -sS https://download.docker.com/linux/debian/gpg | gpg --dearmor > /usr/share/keyrings/docker-ce.gpg
echo "deb [arch=$(dpkg --print-architecture) signed-by=/usr/share/keyrings/docker-ce.gpg] https://mirrors.tuna.tsinghua.edu.cn/docker-ce/linux/debian $(lsb_release -sc) stable" > /etc/apt/sources.list.d/docker.list
    然后更新系统后即可安装 Docker CE 
    apt update
apt install docker-ce docker-ce-cli containerd.io
    我们可以使用 Docker 官方发布的 Github 直接安装最新版本docker-compose： 
    curl -L https://github.com/docker/compose/releases/latest/download/docker-compose-Linux-x86_64 > /usr/local/bin/docker-compose
chmod +x /usr/local/bin/docker-compose
    此时可使用 docker-compose version 命令检查是否安装成功

    当然可以用1panel点点点，也是可以的，我这里用的就是1panel


    二.拉取Core文件

    1.拉取配置文件

    cd /opt && mkdir -p mx-space/core && cd $_
# 拉取 docker-compose.yml 文件
wget https://fastly.jsdelivr.net/gh/mx-space/core@master/docker-compose.yml

    2.修改Core配置文件

    cd /opt/mx-space/core
vim docker-compose.yml
    Warning

    默认配置数据库未使用密码，万不可放行数据库端口！若需要密码/或使用远程数据库，可根据官方文档自行配置

  • JWT 密钥：需要填写长度不小于 16 个字符，不大于 32 个字符的字符串，用于加密用户的 JWT，务必保存好自己的密钥，不要泄露给他人。
  • 被允许的域名：需要填写被允许的域名，通常是前端的域名，如果允许多个域名访问，用英文逗号，分隔。
  • 是否开启加密：如果你确定要开启加密，将 false 改为 true，开启加密后，你需要在下方填写加密密钥。

  • 加密密钥：如果你不知道这是什么，那么不建议开启此功能，具体内容可参考 https://mx-space.js.org/usage/security.html

    若开启加密，则需注意密钥长度必须为 64 位且只有小写字母和数字，不然会在初始化时报错。注意这是不可逆的，务必保存自己的秘钥。所以并不是非常推荐使用，除非你真的需要加密 API Key. 密钥可以通过openssl rand -hex 32命令生成。请务必牢记。

    启动

docker compose up -d

3.反代与更新

1.反向代理(默认为单域名)

以1Panel+OpenResty为例

  1. 新建静态网站
  2. 配置SSL证书开启HTTPS
  3. 在NGINX配置文件最后一个}的上方另起一行，粘贴如下配置，并保存
## 反向代理开始，直接复制官方文档的
    ## WebSocket 地址
    location /socket.io {
        proxy_set_header Upgrade $http_upgrade; 
        proxy_set_header Connection "Upgrade"; 
        proxy_buffering off; 
        proxy_set_header Host $host; 
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; 
        proxy_set_header X-Forwarded-Proto $scheme; 
        proxy_pass http://127.0.0.1:2333/socket.io; 
    }
    ## API 地址
    location /api/v2 {
        proxy_pass http://127.0.0.1:2333/api/v2; 
    }
    ## 简读 render 地址
    location /render {
        proxy_pass http://127.0.0.1:2333/render; 
    }
    ## 前端地址
    location / {
        proxy_pass http://127.0.0.1:2323; 
    }
    ## 后台地址
    location /proxy {
        proxy_pass http://127.0.0.1:2333/proxy;
    }
    location /qaqdmin {
        proxy_pass http://127.0.0.1:2333/proxy/qaqdmin;
    }
    ## RSS 地址
    location ~* \/(feed|sitemap|atom.xml) {
        proxy_pass http://127.0.0.1:2333/$1; 
    }
    ## 反向代理结束

Core初始化

  1. 反向代理配置完成，访问后端 https://后端域名/proxy/qaqdmin
  2. 例： https://api.example.cc/proxy/qaqdmin
  3. 根据页面提示完成初始化， 若完成后未正确跳转后台，

  4. 再次进入 https://api.example.cc/proxy/qaqdmin 即可

    至此，Core内核已经部署完成

Core更新

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

接下来就是前端的部署了

准备工作

Node.js以及相关环境

刷新系统包缓存与安装常用/必备软件包

apt update && apt install git curl vim wget git-lfs -y

1、安装NVM

curl https://raw.githubusercontent.com/creationix/nvm/master/install.sh |bash

2、运行 source ~/.profile 命令将环境变量重新加载到当前会话中。

source ~/.profile

3、列出 Node.JS 的可用版本。

nvm ls-remote

4.确定版本后，运行 nvm install version 命令下载并安装它。例如，安装 Node.JS 20.12.2 ，推荐 V20.12.2 版本(因为别的博主这么说)

# 安装
nvm install 20.12.2
# 检查版本
node -v

5、安装 pnpm pm2

npm install -g pnpm pm2

6. 安装sharp

npm i -g sharp
pnpm add sharp
# 配置sharp环境变量
# export NEXT_SHARP_PATH=/root/node_modules/sharp

Shiro的部署和构建

一.Core后端云函数配置

进入 Mix Space 后台，进入「配置与云函数」页面，点击右上角的新增按钮，在编辑页面中，填入以下设置：

  1. 名称：shiro
  2. 引用：theme
  3. 数据类型：JSON
  4. 数据：右侧复制以下示例，更改为自己的信息(此处我采用innei的实例)

具体可以查看官方文档

{
  "footer": {
    "otherInfo": {
      "date": "2020-{{now}}",
      "icp": {
        "text": "萌 ICP 备 20236136 号",
        "link": "https://icp.gov.moe/?keyword=20236136"
      }
    },
    "linkSections": [
      {
        "name": "关于",
        "links": [
          {
            "name": "关于本站",
            "href": "/about-site"
          },
          {
            "name": "关于我",
            "href": "/about"
          },
          {
            "name": "关于此项目",
            "href": "https://github.com/innei/Shiro",
            "external": true
          }
        ]
      },
      {
        "name": "更多",
        "links": [
          {
            "name": "时间线",
            "href": "/timeline"
          },
          {
            "name": "友链",
            "href": "/friends"
          },
          {
            "name": "监控",
            "href": "https://status.innei.in/status/main",
            "external": true
          }
        ]
      },
      {
        "name": "联系",
        "links": [
          {
            "name": "写留言",
            "href": "/message"
          },
          {
            "name": "发邮件",
            "href": "mailto:i@innei.ren",
            "external": true
          },
          {
            "name": "GitHub",
            "href": "https://github.com/innei",
            "external": true
          }
        ]
      }
    ]
  },
  "config": {
    "color": {
      "light": [
        "#33A6B8",
        "#FF6666",
        "#26A69A",
        "#fb7287",
        "#69a6cc",
        "#F11A7B",
        "#78C1F3",
        "#FF6666",
        "#7ACDF6"
      ],
      "dark": [
        "#F596AA",
        "#A0A7D4",
        "#ff7b7b",
        "#99D8CF",
        "#838BC6",
        "#FFE5AD",
        "#9BE8D8",
        "#A1CCD1",
        "#EAAEBA"
      ]
    },
 
    "bg": [
      "https://github.com/Innei/static/blob/master/images/F0q8mwwaIAEtird.jpeg?raw=true",
      "https://github.com/Innei/static/blob/master/images/IMG_2111.jpeg.webp.jpg?raw=true"
    ],
    "custom": {
      "css": [],
      "styles": [],
      "js": [],
      "scripts": []
    },
    "site": {
      "favicon": "/innei.svg",
      "faviconDark": "/innei-dark.svg"
    },
    "hero": {
      "title": {
        "template": [
          {
            "type": "h1",
            "text": "Hi, I'm ",
            "class": "font-light text-4xl"
          },
          {
            "type": "h1",
            "text": "Innei",
            "class": "font-medium mx-2 text-4xl"
          },
          {
            "type": "h1",
            "text": "👋。",
            "class": "font-light text-4xl"
          },
          {
            "type": "br"
          },
          {
            "type": "h1",
            "text": "A NodeJS Full Stack ",
            "class": "font-light text-4xl"
          },
          {
            "type": "code",
            "text": "<Developer />",
            "class": "font-medium mx-2 text-3xl rounded p-1 bg-gray-200 dark:bg-gray-800/0 hover:dark:bg-gray-800/100 bg-opacity-0 hover:bg-opacity-100 transition-background duration-200"
          },
          {
            "type": "span",
            "class": "inline-block w-[1px] h-8 -bottom-2 relative bg-gray-800/80 dark:bg-gray-200/80 opacity-0 group-hover:opacity-100 transition-opacity duration-200 group-hover:animation-blink"
          }
        ]
      },
      "description": "An independent developer coding with love."
    },
    "module": {
      "activity": {
        "enable": true,
        "endpoint": "/fn/ps/update"
      },
      "donate": {
        "enable": true,
        "link": "https://afdian.net/@Innei",
        "qrcode": [
          "https://cdn.jsdelivr.net/gh/Innei/img-bed@master/20191211132347.png",
          "https://cdn.innei.ren/bed/2023/0424213144.png"
        ]
      },
      "bilibili": {
        "liveId": 1434499
      }
    }
  }
}

二.拉取 Shiro/Shiroi

cd /opt/mx-space
 # 个人习惯在/opt/mx-space目录下部署Mx-Space与前端Shiro/Kami
 # 所以此处./mx-space为mx后端/前端项目文件夹
git clone https://github.com/Innei/Shiro.git

三 · 配置 .env

复制 .env.example 为 .env并编辑 .env 文件


cd /opt/mx-space/Shiro
mv .env.template .env
vim .env

.env示例

# 后端API地址
NEXT_PUBLIC_API_URL=https://api.example.com/api/v2
# 后端网关地址
NEXT_PUBLIC_GATEWAY_URL=https://api.example.com
# TMDB信息获取
TMDB_API_KEY=
# GitHub token，用来获取前端版本哈希
GH_TOKEN=

四.开始构建 Shiro/Shiroi项目

cd /opt/mx-space/Shiro
pnpm i && pnpm build

若服务器所在区域无法访问NPM官方源，可能导致依赖安装失败而出现报错

解决：构建前手动修改项目 .npmrc 配置文件

cd /opt/mx-space/Shiro
vim .npmrc
  # 1 ↑修改registry为taobao源(https://registry.npmmirror.com)或其他国内镜像源
  # nrm use taobao
  # 2 ↑若安装有nrm (npm 的镜像源管理工具）也可使用nrm
pnpm i && pnpm build
  # 最后重新安装依赖、构建

构建完成后就能准备启动,建议是使用screen后台保活，以下给出screen启动方法

Shiro 启动

apt install screen -y
  # Debian/Ubuntu安装Screen
screen -R shiro
  # 新建shiro会话
cd /opt/mx-space/Shiro
npx next start -p 2323
# pnpm prod:pm2
  # 启动shiroi

启动完成后 按 Ctrl+A+D即可退出并挂起 shiro 对话，完成Shiro后台运行。

Screen教程

Shiro更新

# 进入工作目录
cd /opt/mx-space/Shiro
# 更新
git pull
# git push
screen -R shiroi -X quit
# nrm use taobao (根据服务器 位置 / 网络 情况选择是否换源)
# 安装依赖、构建
pnpm i && pnpm build
# 使用screen实现后台启动
screen -R shiroi
npx next start -p 2323

玖月佬说是试过了，那就是能用！

部分问题

可以参考玖月博客，我放在下面了，这里贴上(照抄)一个比较常见的字体下载错误的解决办法

解决：更改hosts文件，为fonts.googleapis.com / fonts.gstatic.com指定一个服务器可以Ping通的IP

可以用itdog查下字体域名的ip，然后服务器尝试ping一下，哪个ping的通就改哪个

参考资料

参考文章1(部署core)

参考文章2(部署前端)

官方部署文档

致谢

感谢玖月,在我部署遇到问题的时候给我的帮助，犯了很多很蠢的错误，他都帮我耐心的解决了，之后有别的问题也问了他，是一个非常好的人，谢谢玖月哥。

使用社交账号登录

  • Loading...
  • Loading...
  • Loading...
  • Loading...
  • Loading...