docs: add the "常见问题" chapter

components/Icons/UnlockAlt.tsx

@@ -0,0 +1,7 @@
+import { SVGProps } from "react";
+
+export function UimUnlockAlt(props: SVGProps<SVGSVGElement>) {
+  return (
+    <svg xmlns="http://www.w3.org/2000/svg" width="1.5em" height="1.5em" viewBox="0 0 24 24" {...props}><path fill="currentColor" d="M8 11a1 1 0 0 1-1-1V7a5.002 5.002 0 0 1 8.532-3.542a5.09 5.09 0 0 1 1.306 2.293a1 1 0 0 1-1.934.505l-.002-.007a3.072 3.072 0 0 0-.786-1.379A3.002 3.002 0 0 0 9 7v3a1 1 0 0 1-1 1zm4 7a1 1 0 0 1-1-1v-3a1 1 0 1 1 2 0v3a1 1 0 0 1-1 1z" opacity=".5"></path><path fill="currentColor" d="M17 9H7a3 3 0 0 0-3 3v7a3 3 0 0 0 3 3h10a3 3 0 0 0 3-3v-7a3 3 0 0 0-3-3zm-4 8a1 1 0 0 1-2 0v-3a1 1 0 1 1 2 0v3z"></path></svg>
+  )
+}

pages/docs/_meta.json

@@ -8,6 +8,11 @@
   "docker": "Docker 部署",
   "scripts": "预设脚本部署",
   "advanced": "进阶部署",
-  "extra": "拓展内容",
-  "community": "社区分享"
+  "community": "社区分享",
+  "-- more": {
+    "type": "separator",
+    "title": "更多"
+  },
+  "problems": "常见问题",
+  "extra": "拓展内容"
 }

pages/docs/index.mdx

@@ -32,12 +32,14 @@ import { UilPaintTool } from '@components/Icons/PaintTool';
 import { UimStar } from '@components/Icons/Star';
 import { FluentPeopleCommunity } from '@components/Icons/PeopleCommunity';
 import { UilExternalLinkAlt } from '@components/Icons/ExternalLinkAlt';
+import { UimUnlockAlt } from '@components/Icons/UnlockAlt';
 
-<Cards num={2}>
+<Cards num={3}>
   <Card arrow title="Docker 部署 （推荐）" href="/docs/docker" icon={<UimDocker />} />
   <Card arrow title="预设脚本部署" href="/docs/scripts" icon={<UilPaintTool />} />
   <Card arrow title="进阶部署" href="/docs/advanced" icon={<UimStar />} />
   <Card arrow title="社区部署教程" href="/docs/community" icon={<FluentPeopleCommunity />} />
+  <Card arrow title="常见问题" href="/docs/problems" icon={<UimUnlockAlt />} />
   <Card arrow title="拓展内容" href="/docs/extra" icon={<UilExternalLinkAlt />} />
 </Cards>
 

pages/docs/problems.mdx

@@ -0,0 +1,149 @@
+# 常见问题
+
+## 后端服务类问题
+
+### 后端 SSL 出现问题
+
+TBD.
+
+很多时候出现前后端联通出现问题的情况都是因为后端的 SSL 配置出现了问题，mx-space 要求前后端都需要同时配置 SSL，否则无法正常工作。
+
+请检查你的后端 SSL 配置是否正确，我们推荐你使用 Caddy，使用 Caddy 可以很方便的配置 SSL
+
+### 后端 Cross-Origin 设置错误
+
+TBD.
+
+### 网关、API 填错 / 填反
+
+按照常理思路，即本文档所介绍的部署方式，你的网关地址应该是 `https://api.example.com`，而你的 API 地址应该是 `https://api.example.com/api/v2`
+
+二者填反，会导致前端无法正常访问 API，从而导致前端无法正常工作。
+
+### 后台无法获取 IP 归属地
+
+附加功能 → 配置与云函数，找到位于 built-in 里边的 ip 函数，编辑替换如下内容并保存。
+
+```ts
+import { isIPv4, isIPv6 } from 'net'
+import { URLSearchParams } from 'url'
+
+const TIMEOUT = 5000
+
+export default async function handler(ctx: Context, timeout = TIMEOUT) {
+  const { ip } = ctx.req.query
+
+  if (!ip) { ctx.res.throws(422, 'ip is empty') }
+  const cache = ctx.storage.cache
+  const hasCatch = await cache.get(ip)
+
+  if (hasCatch) {
+    const cachedData = typeof hasCatch === 'string' ? JSON.parse(hasCatch) : hasCatch;
+    return cachedData;
+  }
+
+  const result = await getIp(ctx, ip);
+  await cache.set(ip, result)
+  return result
+}
+
+async function getIp(ctx: Context, ip: string, timeout = TIMEOUT) {
+  const isV4 = isIPv4(ip)
+  const isV6 = isIPv6(ip)
+  const { axios } = await (ctx.getService('http'))
+  if (!isV4 && !isV6) {
+    ctx.throws(422, 'Invalid IP')
+  }
+  try {
+    const data = await axios.get(`http://ip-api.com/json/${ip}?lang=zh-CN`).then(data => data.data) as Ip
+    const res: FinalIpRecord = {
+      cityName: data.city,
+      countryName: data.country,
+      ip: data.query,
+      ispDomain: data.isp,
+      ownerDomain: data.org,
+      regionName: data.regionName
+
+    }
+
+    return res
+  } catch (e) {
+    ctx.throws(500, `IP API 调用失败，${e.message}`)
+  }
+};
+
+interface FinalIpRecord {
+  cityName: string
+  countryName: string
+  ip: string
+  ispDomain: string
+  ownerDomain: string
+  regionName: string
+}
+
+interface Ip {
+  country: string;
+  countryCode: string;
+  region: string;
+  regionName: string;
+  city: string;
+  zip: string;
+  lat: number;
+  lon: number;
+  timezone: string;
+  isp: string;
+  org: string;
+  as: string;
+  query: string;
+}
+```
+
+### 内核出现问题
+
+TBD.
+
+### Docker MongoDB Container 无法正常启动
+
+如果您是使用 Docker 部署的 Core，更新后，你却发现 MongoDB Container 无法正常启动（一直在 `Restarting` 状态）这大概率是因为 MongoDB 大版本更新出现 BREAKING CHANGE 导致的，这种情况下，你需要锁定 MongoDB 的版本。
+
+请前往 `docker-compose.yml`，锁定 MongoDB 的版本，例如：
+
+```diff
+mongo:
+  container_name: mongo
+-  image: mongo
++  image: mongo:6.0.8
+```
+
+接着重新执行 `docker compose up -d` 即可。
+
+## 前端主题类问题
+
+### ClientSide 报错
+
+> 此处是讲述如何 Debug，而非如何解决问题，这里发生的问题数不胜数，无法一一列举，建议通过 AI + Google + GitHub Issues 来解决问题
+
+这是最常见的问题，也是最容易解决的问题，你只需要打开浏览器的开发者工具，查看控制台输出即可，如果你不知道如何打开浏览器的开发者工具，那么你可以通过 Google 来解决「如何打开」这个问题。
+
+在截取控制台输出的时候，你可以通过截图的方式，也可以通过复制的方式，请不要只截取一部分，而是截取全部，我们发现有一些只截取报错的前几行，而不截取完整的报错信息，这样我们是无法帮助你解决问题的。
+
+### ServerSide 报错
+
+> 此处是讲述如何 Debug，而非如何解决问题，这里发生的问题数不胜数，无法一一列举，建议通过 AI + Google + GitHub Issues 来解决问题
+
+ServerSide 报错，通常是指后端报错，这种报错通常是由于后端配置错误导致的，你可以通过查看后端的日志来解决问题。
+
+如果你是使用 Vercel 部署的，查看错误日志的方式如下：
+
+1. 打开 Vercel 的控制台
+2. 点击你的项目
+3. 点击「Logs」
+4. 查看错误日志
+
+同样的，你也可以通过截图或者复制的方式来获取完整的错误日志，但不是只截取一部分。
+
+如果你是使用 Docker 部署的，查看错误日志的方式如下：
+
+1. 打开你的服务器
+2. 进入你的 Docker 容器
+3. 查看错误日志