零成本搭建 Shiro 主题博客

写在之前

今天serv00又偷摸开放注册了,这个教程其实老早就想写,只是因为之前测试的时候号被噶了,没得机会,本以为要雪藏了,奈何serv00犹抱琵琶,如之奈何?

之前测试时,内存占用达到了1000%。今次修改,对原仓库的配置文件进行了优化调整,限制cluster实例为3,避免了过高占用,也在此提醒,不要放纵内存歇斯底里,因为真的会封号。

现在对项目框架作简要说明:

  • 前端:Shiro,使用 vercel 托管
  • 后端: Mix Space,使用 serv00 托管

我搭建的示例站点:https://reno.zone.id

本教程使用一键脚本快速搭建后端,自动完成数据库和缓存的创建,执行即运行

快速部署

  1. vercel托管前端

    • 注册 vercel,点击前往

    • 点击创建,名称填写 shiro,修改环境变量后点击 Deploy 部署

      Name Value Description
      NEXT_PUBLIC_API_URL https://xxx.serv00.net/api/v2 后端API接口地址
      NEXT_PUBLIC_GATEWAY_URL https://xxx.serv00.net/ 后端域名
    • 修改区域,在 Settings - Functions - Function Region 选择 Asia - Hong Kong,注意先取消勾选再选择

    • 自定义域,注意 vercel 分配的域名国内无法直连需要添加自定义域:

      1. 在 cloudflare 需要绑定的域名添加一条 A 记录指向 76.223.126.88
      2. 进入 vercel 的 shiro 项目依次点击 Settings - Domains - Add
      3. 输入绑定的域名,然后点击 Add Domain,勾选第三项后点击 Add 完成域名自定义
  2. serv00托管后端

    • 注册 Serv00 (今天早上刚开放) 并 ssh 登入

    • 首次使用,需先打开服务

    devil binexec on
    
    • 警告:执行脚本将会重置机器,请务必确认已知其影响
    • 断开ssh重连,然后使用一键安装脚本安装,中途按提示输入前端的自定义域即可,格式形如 linux.do
    bash <(curl -sL https://raw.githubusercontent.com/Raimbaulty/freebsd/main/core.sh)
    
  3. 完成主题配置

    • 部署前后端之后,还需要访问后台地址完成主题的安装

    • 访问后台管理界面:https://xxx.serv00.net/proxy/qaqdmin ,按照提示操作登入

    • 登入后点击左侧底部 附加功能 - 配置与云函数,点击 + 新建

    • 名称 填写 shiro引用 填写 theme ,并在右侧代码区粘贴以下代码,请自行酌情修改后点击右上角绿色按钮保存后访问前端自定义域查看网站效果

      {
        "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:[email protected]",
                  "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
            }
          }
      
        }
      }
      

    参考链接

33 个赞

太强了reno佬 :tieba_087:

4 个赞

这种前后端分离的博客,部署在两个地方,访问速度会受很大的影响

1 个赞

其实也可以放在一台服务器,但是负载会比较高 :rofl:

1 个赞

感谢大佬分享! :laughing:

大佬强!占个座,有空去试试看

太强了reno佬 :tieba_087:

3 个赞

太强了 bbb!

3 个赞

@bbb 巨佬太强了 :tieba_087:

2 个赞

太强了,reno佬!

感谢分享。

感谢佬友分享

太强了,立刻学习
@bbb

2 个赞

感谢佬友分享的教程

感谢佬友分享,就差一个serv00了

2 个赞

有空去试试看 就差一个serv00了

2 个赞

谢谢佬的教程,刚好今天我运气好注册到了,正在为装博客爆内存烦恼,等下回去就试试!

在这一步就倒下了…好难,完全不知道怎么继续了 :tieba_087:

加油啊 :wink:

上面那个name填shiro就行

这个create一直点不了:rofl:
image
我换个浏览器试试