<?xml version="1.0" encoding="UTF-8"?><rss version="2.0" xmlns:content="http://purl.org/rss/1.0/modules/content/"><channel><title>Blyの小破站~</title><description>はくれん</description><link>https://blyciallo.com/</link><templateTheme>Firefly</templateTheme><templateThemeVersion>6.16.8</templateThemeVersion><templateThemeUrl>https://github.com/CuteLeaf/Firefly</templateThemeUrl><lastBuildDate>2026年9月17日 22:28:22</lastBuildDate><item><title>我的API中转站：blyciallololiyyds.xyz</title><link>https://blyciallo.com/posts/wo-de-api-zhong-zhuan-zhan-blyciallololiyyds-xyz/</link><guid isPermaLink="true">https://blyciallo.com/posts/wo-de-api-zhong-zhuan-zhan-blyciallololiyyds-xyz/</guid><pubDate>Wed, 26 Aug 2026 00:00:00 GMT</pubDate><content:encoded>&lt;p&gt;我的中转站：blyciallololiyyds.xzy 他一般我自用，用我接入Agent来做各种事情，这个api中转站已经很久没管过了，打开我的api中转站得用VPN打开，进去注册账号，联系我可以送你额度 （在说一下为什么取那么长的域名） Bly是我的名字 Ciallo~（不用多说，柚子厨旮旯给木）&lt;/p&gt;
&lt;p&gt;&lt;img src=&quot;/assets/images/posts/D658EE0E223426882E12AA4EFBEBEA3F.png&quot; alt=&quot;&quot; /&gt;&lt;/p&gt;
&lt;p&gt;&lt;img src=&quot;/assets/images/posts/23FDEC49A6424D0E26C75650D9757278-1.jpg&quot; alt=&quot;&quot; /&gt;&lt;/p&gt;</content:encoded></item><item><title>我的Bly多账号管理~</title><link>https://blyciallo.com/posts/wo-de-bly-duo-zhang-hao-guan-li/</link><guid isPermaLink="true">https://blyciallo.com/posts/wo-de-bly-duo-zhang-hao-guan-li/</guid><pubDate>Wed, 26 Aug 2026 00:00:00 GMT</pubDate><content:encoded>&lt;p&gt;我的Bly多账号管理
&lt;img src=&quot;/assets/images/posts/QQ20260813-025808-4.png&quot; alt=&quot;&quot; /&gt;
还可以进行密码验证&lt;/p&gt;
&lt;p&gt;&lt;img src=&quot;/assets/images/posts/QQ20260813-025523-4.png&quot; alt=&quot;&quot; /&gt;
可以进行批量加群，定时批量发消息，以及自动交互功能，代理ip功能，进行自动营销，自动养号，自动引流，打广告等各种用途&lt;/p&gt;</content:encoded></item><item><title>我的秘密~</title><link>https://blyciallo.com/posts/wo-de-mi-mi/</link><guid isPermaLink="true">https://blyciallo.com/posts/wo-de-mi-mi/</guid><description>有本事破解我密码~</description><pubDate>Wed, 26 Aug 2026 00:00:00 GMT</pubDate><content:encoded>本文已加密保护，请访问网站查看。</content:encoded></item><item><title>无意间发现的Bot</title><link>https://blyciallo.com/posts/wu-yi-jian-fa-xian-de-bot/</link><guid isPermaLink="true">https://blyciallo.com/posts/wu-yi-jian-fa-xian-de-bot/</guid><pubDate>Wed, 26 Aug 2026 00:00:00 GMT</pubDate><content:encoded>&lt;section&gt;&lt;h1&gt;🌸 Mioku：以初音未来为主题、AI 优先的 QQ 机器人框架&lt;a href=&quot;#-mioku以初音未来为主题ai-优先的-qq-机器人框架&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h1&gt;&lt;blockquote&gt;&lt;p&gt;轻量、现代、Agent 优先～&lt;br /&gt;
基于 mioki，让机器人真正「会用 QQ」的可爱框架。&lt;/p&gt;&lt;/blockquote&gt;&lt;hr /&gt;&lt;section&gt;&lt;h2&gt;📌 项目简介&lt;a href=&quot;#-项目简介&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;&lt;strong&gt;Mioku&lt;/strong&gt; 是一个以&lt;strong&gt;初音未来&lt;/strong&gt;为主题、基于 &lt;a href=&quot;https://mioki.viki.moe/&quot; target=&quot;_blank&quot;&gt;mioki&lt;/a&gt; 的 &lt;strong&gt;AI 优先&lt;/strong&gt; QQ 机器人框架。&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;仓库地址：&lt;a href=&quot;https://github.com/mioku-lab/mioku&quot; target=&quot;_blank&quot;&gt;https://github.com/mioku-lab/mioku&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;官网：&lt;a href=&quot;https://mioku.pages.dev&quot; target=&quot;_blank&quot;&gt;https://mioku.pages.dev&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;开源协议：MIT&lt;/li&gt;
&lt;li&gt;技术栈：TypeScript + Bun&lt;/li&gt;
&lt;li&gt;底层协议：NapCat / OneBot v11&lt;/li&gt;
&lt;/ul&gt;&lt;p&gt;它不是传统意义上的「接大模型聊天机器人」，而是围绕 &lt;strong&gt;Agent / Skill&lt;/strong&gt; 设计，让机器人可以自然地使用 QQ 功能、调用自己的插件完成各种任务。&lt;/p&gt;&lt;hr /&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;✨ 核心特性&lt;a href=&quot;#-核心特性&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;

&lt;table&gt;&lt;thead&gt;&lt;tr&gt;&lt;th&gt;特性&lt;/th&gt;&lt;th&gt;说明&lt;/th&gt;&lt;/tr&gt;&lt;/thead&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td&gt;🔌 &lt;strong&gt;插件系统&lt;/strong&gt;&lt;/td&gt;&lt;td&gt;支持独立 npm 包管理，支持热插拔&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;🛠️ &lt;strong&gt;服务架构&lt;/strong&gt;&lt;/td&gt;&lt;td&gt;可复用的服务层，插件声明式依赖&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;🤖 &lt;strong&gt;AI Skill 系统&lt;/strong&gt;&lt;/td&gt;&lt;td&gt;插件可注册 Skill，内含多个 AI 工具&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;📚 &lt;strong&gt;帮助系统&lt;/strong&gt;&lt;/td&gt;&lt;td&gt;插件帮助信息自动注册与生成&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;⚙️ &lt;strong&gt;配置管理&lt;/strong&gt;&lt;/td&gt;&lt;td&gt;插件独立配置，支持热更新&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;📦 &lt;strong&gt;Workspace 管理&lt;/strong&gt;&lt;/td&gt;&lt;td&gt;使用 bun workspace，插件与服务独立依赖&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;p&gt;官方还提供了配套项目：&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;&lt;code&gt;mioku-webui&lt;/code&gt;：可视化管理界面&lt;/li&gt;
&lt;li&gt;多个官方插件：表情包、群管理、60s、MC 连接等&lt;/li&gt;
&lt;/ul&gt;&lt;hr /&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;💖 为什么选择 Mioku？&lt;a href=&quot;#-为什么选择-mioku&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;ol&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;真正 AI 优先&lt;/strong&gt;&lt;br /&gt;
不是简单对接大模型，而是围绕 Agent / Skill 设计，机器人可以主动完成任务。&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;轻量高性能&lt;/strong&gt;&lt;br /&gt;
使用现代 TypeScript + Bun，官方称空载内存不超过 100MB。&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;开发体验好&lt;/strong&gt;&lt;br /&gt;
插件以 npm 包形式管理，支持热插拔和配置热更新。&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;一键启动友好&lt;/strong&gt;&lt;br /&gt;
&lt;code&gt;npx mioku&lt;/code&gt; 即可创建项目，引导式配置，新手友好。&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;自带 WebUI&lt;/strong&gt;&lt;br /&gt;
可视化管理插件、服务和配置，不用全程敲命令。&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;初音主题加持&lt;/strong&gt;&lt;br /&gt;
对喜欢初音未来的用户，自带一份可爱滤镜～&lt;/p&gt;
&lt;/li&gt;
&lt;/ol&gt;&lt;blockquote&gt;&lt;p&gt;目前项目还比较新，生态处于早期阶段。喜欢尝鲜和 AI Agent 玩法的朋友可以重点关注。&lt;/p&gt;&lt;/blockquote&gt;&lt;hr /&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;🛠️ 环境要求&lt;a href=&quot;#️-环境要求&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;使用前请准备好以下环境：&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;&lt;a href=&quot;https://bun.sh/&quot; target=&quot;_blank&quot;&gt;Bun&lt;/a&gt;（推荐一键安装：&lt;code&gt;npm install -g bun&lt;/code&gt;）&lt;/li&gt;
&lt;li&gt;Git&lt;/li&gt;
&lt;li&gt;Chromium 内核浏览器（Chrome / Edge 等，用于截图服务）&lt;/li&gt;
&lt;li&gt;ffmpeg（部分插件需要）&lt;/li&gt;
&lt;li&gt;一个可用的 &lt;strong&gt;NapCat&lt;/strong&gt; 或其它 OneBot v11 实现端&lt;/li&gt;
&lt;/ul&gt;&lt;hr /&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;🚀 快速开始&lt;a href=&quot;#-快速开始&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;section&gt;&lt;h3&gt;1. 一键创建项目&lt;a href=&quot;#1-一键创建项目&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;Terminal window&lt;/span&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;npx&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;mioku&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;首次启动会自动询问 mioki 相关配置，并引导你填写 NapCat 正向 WebSocket 配置，同时询问是否安装 WebUI。&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;2. 启动项目&lt;a href=&quot;#2-启动项目&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;Terminal window&lt;/span&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;cd&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;&amp;lt;你的项目名&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;bun&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;run&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;start&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;3. 访问 WebUI&lt;a href=&quot;#3-访问-webui&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;浏览器打开：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;http://127.0.0.1:3339&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;首次启动会提示设置登录密钥。&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;4. 安装插件 / 服务&lt;a href=&quot;#4-安装插件--服务&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;span&gt;&lt;/span&gt;&lt;span&gt;Terminal window&lt;/span&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 安装插件示例&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;npx&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;mioku&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;install&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;plugin&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;60s&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;npx&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;mioku&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;install&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;plugin&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;meme&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 安装服务示例&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;npx&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;mioku&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;install&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;service&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;ai&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 更新所有相关包&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;9&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;npx&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;mioku&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;update&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;all&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;10&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;11&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 更新框架自身&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;12&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;npx&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;mioku&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;update&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;self&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;推荐优先使用 WebUI 进行插件与服务的管理，操作更直观。&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;&lt;/section&gt;</content:encoded></item><item><title>想开发软件项目的可以找我~</title><link>https://blyciallo.com/posts/xiang-kai-fa-ruan-jian-xiang-mu-de-ke-yi-zhao-wo/</link><guid isPermaLink="true">https://blyciallo.com/posts/xiang-kai-fa-ruan-jian-xiang-mu-de-ke-yi-zhao-wo/</guid><description>🌸 软件 · 自动化 · 好想法</description><pubDate>Wed, 26 Aug 2026 00:00:00 GMT</pubDate><content:encoded>&lt;section&gt;&lt;h1&gt;🌸 软件 · 自动化 · 好想法&lt;a href=&quot;#-软件--自动化--好想法&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h1&gt;&lt;blockquote&gt;&lt;p&gt;想做软件、搞自动化，或者有什么好玩的点子？&lt;br /&gt;
都可以来找我聊聊～&lt;/p&gt;&lt;/blockquote&gt;&lt;hr /&gt;&lt;section&gt;&lt;h2&gt;✨ 可以找我做什么？&lt;a href=&quot;#-可以找我做什么&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;如果你有以下需求或想法，欢迎随时联系我：&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;想开发软件 / 小工具&lt;/li&gt;
&lt;li&gt;需要做各种自动化脚本&lt;/li&gt;
&lt;li&gt;有好的 idea，但不知道怎么落地&lt;/li&gt;
&lt;li&gt;单纯想找人一起头脑风暴&lt;/li&gt;
&lt;/ul&gt;&lt;p&gt;不管是正经项目，还是脑洞大开的小玩意，我都挺感兴趣的～&lt;/p&gt;&lt;/section&gt;&lt;/section&gt;</content:encoded></item><item><title>怎么用Netlify反代</title><link>https://blyciallo.com/posts/zen-me-yong-netlify-fan-dai/</link><guid isPermaLink="true">https://blyciallo.com/posts/zen-me-yong-netlify-fan-dai/</guid><pubDate>Wed, 26 Aug 2026 00:00:00 GMT</pubDate><content:encoded>&lt;p&gt;🌸 Netlify 反向代理小教程&lt;/p&gt;
&lt;blockquote&gt;&lt;p&gt;用 Netlify 轻松实现反向代理，解决 CORS、隐藏真实接口地址，还超简单！&lt;br /&gt;
适合前端、独立开发者和博客站长～&lt;/p&gt;&lt;/blockquote&gt;
&lt;hr /&gt;
&lt;section&gt;&lt;h2&gt;✨ 什么是 Netlify 反向代理？&lt;a href=&quot;#-什么是-netlify-反向代理&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;Netlify 的 &lt;strong&gt;Rewrites / Proxies&lt;/strong&gt; 功能，本质上是把重定向状态码设为 &lt;code&gt;200&lt;/code&gt;。&lt;/p&gt;&lt;p&gt;浏览器地址栏&lt;strong&gt;不会变&lt;/strong&gt;，但请求会由 Netlify 的 CDN 在后端帮你转发到目标地址。&lt;br /&gt;
超级适合：&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;解决跨域（CORS）问题&lt;/li&gt;
&lt;li&gt;隐藏真实 API 地址&lt;/li&gt;
&lt;li&gt;把多个服务统一到一个域名下&lt;/li&gt;
&lt;li&gt;网站迁移时平滑过渡&lt;/li&gt;
&lt;/ul&gt;&lt;p&gt;官方文档：&lt;a href=&quot;https://docs.netlify.com/manage/routing/redirects/rewrites-proxies/&quot; target=&quot;_blank&quot;&gt;Rewrites and proxies&lt;/a&gt;&lt;/p&gt;&lt;hr /&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;🧁 方法一：使用 &lt;code&gt;_redirects&lt;/code&gt; 文件（最简单）&lt;a href=&quot;#-方法一使用-_redirects-文件最简单&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;在网站的&lt;strong&gt;发布目录&lt;/strong&gt;（通常是 &lt;code&gt;public&lt;/code&gt;、&lt;code&gt;dist&lt;/code&gt;、&lt;code&gt;build&lt;/code&gt; 或根目录）下创建 &lt;code&gt;_redirects&lt;/code&gt; 文件（注意：没有扩展名）。&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 把 /api/* 代理到 https://api.example.com/*&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;/api/*  https://api.example.com/:splat  200&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 强制代理（即使本地有同名文件也优先代理）&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;/api/*  https://api.example.com/:splat  200!&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 代理整个网站&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;/*  https://target-site.com/:splat  200&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;ul&gt;
&lt;li&gt;&lt;code&gt;:splat&lt;/code&gt; 会自动捕获后面的所有路径&lt;/li&gt;
&lt;li&gt;末尾加 &lt;code&gt;!&lt;/code&gt; 表示强制生效（对应 &lt;code&gt;force = true&lt;/code&gt;）&lt;/li&gt;
&lt;/ul&gt;&lt;hr /&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;🍬 方法二：使用 &lt;code&gt;netlify.toml&lt;/code&gt;（推荐，功能更强）&lt;a href=&quot;#-方法二使用-netlifytoml推荐功能更强&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;在项目根目录创建或编辑 &lt;code&gt;netlify.toml&lt;/code&gt;：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;[[&lt;/span&gt;&lt;span&gt;redirects&lt;/span&gt;&lt;span&gt;]]&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;from&lt;/span&gt;&lt;span&gt; = &lt;/span&gt;&lt;span&gt;&quot;/api/*&quot;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;to&lt;/span&gt;&lt;span&gt; = &lt;/span&gt;&lt;span&gt;&quot;https://api.example.com/:splat&quot;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;status&lt;/span&gt;&lt;span&gt; = &lt;/span&gt;&lt;span&gt;200&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;force&lt;/span&gt;&lt;span&gt; = &lt;/span&gt;&lt;span&gt;true&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;6&lt;/div&gt;&lt;/div&gt;&lt;div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;7&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;# 还可以添加自定义请求头哦～&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;8&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;[[&lt;/span&gt;&lt;span&gt;redirects&lt;/span&gt;&lt;span&gt;]]&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;9&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;from&lt;/span&gt;&lt;span&gt; = &lt;/span&gt;&lt;span&gt;&quot;/search&quot;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;10&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;to&lt;/span&gt;&lt;span&gt; = &lt;/span&gt;&lt;span&gt;&quot;https://api.mysearch.com&quot;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;11&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;status&lt;/span&gt;&lt;span&gt; = &lt;/span&gt;&lt;span&gt;200&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;12&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;force&lt;/span&gt;&lt;span&gt; = &lt;/span&gt;&lt;span&gt;true&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;13&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;headers&lt;/span&gt;&lt;span&gt; = {&lt;/span&gt;&lt;span&gt;X-From&lt;/span&gt;&lt;span&gt; = &lt;/span&gt;&lt;span&gt;&quot;Netlify&quot;&lt;/span&gt;&lt;span&gt;, &lt;/span&gt;&lt;span&gt;X-Custom&lt;/span&gt;&lt;span&gt; = &lt;/span&gt;&lt;span&gt;&quot;value&quot;&lt;/span&gt;&lt;span&gt;}&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;hr /&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;🍓 常见使用场景示例&lt;a href=&quot;#-常见使用场景示例&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;section&gt;&lt;h3&gt;1. 代理第三方 API（解决 CORS）&lt;a href=&quot;#1-代理第三方-api解决-cors&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;[[&lt;/span&gt;&lt;span&gt;redirects&lt;/span&gt;&lt;span&gt;]]&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;from&lt;/span&gt;&lt;span&gt; = &lt;/span&gt;&lt;span&gt;&quot;/api/*&quot;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;to&lt;/span&gt;&lt;span&gt; = &lt;/span&gt;&lt;span&gt;&quot;https://api.example.com/:splat&quot;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;status&lt;/span&gt;&lt;span&gt; = &lt;/span&gt;&lt;span&gt;200&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;force&lt;/span&gt;&lt;span&gt; = &lt;/span&gt;&lt;span&gt;true&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;前端直接请求 &lt;code&gt;/api/xxx&lt;/code&gt; 就行，超级方便！&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;2. 代理到另一个 Netlify 站点&lt;a href=&quot;#2-代理到另一个-netlify-站点&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;[[&lt;/span&gt;&lt;span&gt;redirects&lt;/span&gt;&lt;span&gt;]]&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;from&lt;/span&gt;&lt;span&gt; = &lt;/span&gt;&lt;span&gt;&quot;/other/*&quot;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;3&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;to&lt;/span&gt;&lt;span&gt; = &lt;/span&gt;&lt;span&gt;&quot;https://my-other-site.netlify.app/:splat&quot;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;4&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;status&lt;/span&gt;&lt;span&gt; = &lt;/span&gt;&lt;span&gt;200&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;5&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;  &lt;/span&gt;&lt;span&gt;force&lt;/span&gt;&lt;span&gt; = &lt;/span&gt;&lt;span&gt;true&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;推荐使用 &lt;code&gt;.netlify.app&lt;/code&gt; 域名。&lt;/p&gt;&lt;/section&gt;&lt;section&gt;&lt;h3&gt;3. 代理整个旧网站（迁移场景）&lt;a href=&quot;#3-代理整个旧网站迁移场景&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;/*  https://old-site.com/:splat  200!&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;hr /&gt;&lt;/section&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;📌 小贴士与注意事项&lt;a href=&quot;#-小贴士与注意事项&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;

&lt;table&gt;&lt;thead&gt;&lt;tr&gt;&lt;th&gt;项目&lt;/th&gt;&lt;th&gt;说明&lt;/th&gt;&lt;/tr&gt;&lt;/thead&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td&gt;&lt;strong&gt;缓存&lt;/strong&gt;&lt;/td&gt;&lt;td&gt;代理响应默认不缓存。如果目标支持 ETag / Last-Modified，可以自动缓存&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;&lt;strong&gt;自定义头&lt;/strong&gt;&lt;/td&gt;&lt;td&gt;只能在 &lt;code&gt;netlify.toml&lt;/code&gt; 中添加自定义请求头&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;&lt;strong&gt;规则顺序&lt;/strong&gt;&lt;/td&gt;&lt;td&gt;从上到下匹配，更具体的规则要写在前面&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;&lt;strong&gt;本地测试&lt;/strong&gt;&lt;/td&gt;&lt;td&gt;使用 &lt;code&gt;netlify dev&lt;/code&gt; 命令即可本地预览&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;&lt;strong&gt;限制&lt;/strong&gt;&lt;/td&gt;&lt;td&gt;不是完整的 Nginx 级反向代理，复杂场景建议使用 Edge Functions&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;hr /&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;🌈 更复杂的需求怎么办？&lt;a href=&quot;#-更复杂的需求怎么办&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;如果需要：&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;任意 URL 通用代理&lt;/li&gt;
&lt;li&gt;自动重写 HTML 内容&lt;/li&gt;
&lt;li&gt;添加密码保护&lt;/li&gt;
&lt;li&gt;更灵活的逻辑处理&lt;/li&gt;
&lt;/ul&gt;&lt;p&gt;可以尝试使用 &lt;strong&gt;Netlify Edge Functions&lt;/strong&gt;（基于 Deno）。&lt;br /&gt;
GitHub 上搜索 &lt;code&gt;netlify proxy edge function&lt;/code&gt; 有很多现成模板可以参考～&lt;/p&gt;&lt;hr /&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;✅ 快速验证方法&lt;a href=&quot;#-快速验证方法&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;部署完成后，打开浏览器开发者工具（F12）→ Network 面板：&lt;/p&gt;&lt;ol&gt;
&lt;li&gt;访问你的域名 + 代理路径&lt;/li&gt;
&lt;li&gt;看请求状态码是否为 &lt;code&gt;200&lt;/code&gt;&lt;/li&gt;
&lt;li&gt;确认返回内容来自目标站点&lt;/li&gt;
&lt;/ol&gt;&lt;p&gt;如果一切正常，就成功啦！🎉&lt;/p&gt;&lt;hr /&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;💌 写在最后&lt;a href=&quot;#-写在最后&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;Netlify 的反向代理功能真的很贴心，配置简单、全球 CDN 加速、免费额度也够用。&lt;br /&gt;
希望这篇小教程能帮到你～&lt;/p&gt;&lt;p&gt;有具体需求（比如代理某个 AI 接口、整个博客、或者复杂路由）随时告诉我，我可以帮你写出更精确的配置～&lt;/p&gt;&lt;p&gt;祝部署顺利，代码无 Bug！✨&lt;/p&gt;&lt;/section&gt;</content:encoded></item><item><title>关键词监听机器人~</title><link>https://blyciallo.com/posts/guan-jian-ci-jian-ting-ji-qi-ren/</link><guid isPermaLink="true">https://blyciallo.com/posts/guan-jian-ci-jian-ting-ji-qi-ren/</guid><description>哈基米~~~</description><pubDate>Thu, 13 Aug 2026 00:00:00 GMT</pubDate><content:encoded>&lt;p&gt;监控所有已加入的群聊，你设定的关键词，可监听所有的群聊，当有人发消息匹配到你的关键词，机器人将会把用户信息ID和哪个群（可一件定位）到所发消息的地方，把用户信息ID统一打包发给你，部署到服务器上面可24小时无间断监听~~~配合多账号管理太爽了~
&lt;img src=&quot;/assets/images/posts/QQ20260813-032308.png&quot; alt=&quot;&quot; /&gt;&lt;/p&gt;
&lt;p&gt;&lt;img src=&quot;/assets/images/posts/QQ20260813-031719.png&quot; alt=&quot;&quot; /&gt;&lt;/p&gt;</content:encoded></item><item><title>Cloudflare VS Vercel？！</title><link>https://blyciallo.com/posts/cloudflare-vs-vercel/</link><guid isPermaLink="true">https://blyciallo.com/posts/cloudflare-vs-vercel/</guid><pubDate>Wed, 12 Aug 2026 00:00:00 GMT</pubDate><content:encoded>&lt;p&gt;引言
Vercel 和 Cloudflare 是目前较为常见的两个 Web 部署平台。Vercel 偏向前端生态和开发体验，Cloudflare 则依托其全球边缘网络提供底层计算和存储能力。两者都在往”全栈应用交付平台”的方向发展，但实现路径和适用场景有所不同。&lt;/p&gt;
&lt;p&gt;本文将介绍双方的服务和异同点，希望能帮读者理清其中的差别，从而根据自身需求做出合适的选择。&lt;/p&gt;
&lt;p&gt;Cloudflare
Cloudflare 依托其全球边缘网络，将计算和存储部署在离用户较近的节点上。以下是其四个核心服务。&lt;/p&gt;
&lt;p&gt;Workers
Workers 是一个在 Cloudflare 全球网络上运行的无服务器计算平台，基于 Service Workers API，运行在 V8 隔离环境中，启动速度快。&lt;/p&gt;
&lt;p&gt;能跑什么后端代码： Workers 运行在 V8 引擎上，不兼容完整的 Node.js API（没有 fs、net 等模块），但提供了 fetch、Request、Response 等 Web 标准 API。支持的编程语言包括 JavaScript、TypeScript、Rust（编译为 WASM）和 Python（通过 Pyodide）。&lt;/p&gt;
&lt;p&gt;能运行什么框架：&lt;/p&gt;
&lt;p&gt;Web 框架：Hono、Itty Router
全栈框架：Astro（SSR）、SvelteKit、Remix、SolidStart
静态站点：Hugo、Jekyll、Zola、Astro（静态模式）
免费计划每天 10 万次请求，128 MB 内存。&lt;/p&gt;
&lt;p&gt;D1
D1 是 Cloudflare 的无服务器关系型数据库，基于 SQLite，可通过 Workers 直接访问或通过 HTTP API 操作，无需管理连接池。免费计划 5 GB 存储。&lt;/p&gt;
&lt;p&gt;KV
Workers KV 是一个全局键值存储，数据被复制到 Cloudflare 的边缘节点，适合存储配置、缓存数据等。免费计划 10 万个键。&lt;/p&gt;
&lt;p&gt;R2
R2 是 Cloudflare 的对象存储服务，兼容 S3 API，特点是不收取出口流量费。阿里云 OSS 属于同一类。它主要用于存储非结构化数据，所以可以存很多东西，甚于像本站一样的博客。免费计划 10 GB 存储。&lt;/p&gt;
&lt;p&gt;Vercel
Vercel 与前端的框架整合较好，提供了从开发到部署的一体化体验。&lt;/p&gt;
&lt;p&gt;Node.js 运行时
Vercel 的核心无服务器函数基于 Node.js 运行时，也支持 Python、Go、Ruby、Bun。函数在 AWS Lambda 上执行，可以使用完整的 Node.js API。&lt;/p&gt;
&lt;p&gt;能跑什么后端代码： 函数运行在标准的 Node.js 环境中，可以访问 fs、net、http、child_process 等所有 Node.js 内置模块，也可以安装任何 npm 包。因此能跑大多数 Node.js 后端代码，包括 Express、Fastify、Apollo Server 等。注意函数有超时限制（Hobby 计划 60 秒），不适合长时间运行的后台任务。&lt;/p&gt;
&lt;p&gt;能运行什么框架：&lt;/p&gt;
&lt;p&gt;React 框架：Next.js（原生支持最好）、Remix
Vue 框架：Nuxt
Svelte 框架：SvelteKit
通用框架：Astro、VitePress、Docusaurus、Hexo
几乎所有前端框架都能自动检测并选择最佳构建配置
免费计划每月 100 小时函数执行时间，单函数最大 50 MB。&lt;/p&gt;
&lt;p&gt;数据库（PostgreSQL）
Vercel 与 Neon 合作提供了 Vercel Postgres（现为 Vercel Storage 的一部分），是标准的 PostgreSQL 数据库。也可以用 pg 或 @vercel/postgres 连接外部 PG 实例，如 Supabase、AWS RDS 等。&lt;/p&gt;
&lt;p&gt;构建系统
Vercel 的构建系统会为每次 git push 自动触发构建和部署，自动检测框架并生成预览环境。免费计划每月 6,000 分钟构建时长。&lt;/p&gt;
&lt;p&gt;D1（SQLite）与 PG 的差异
D1 基于 SQLite，PostgreSQL（Neon）是一个独立的关系型数据库，两者差异不小：
什么项目适合什么：&lt;/p&gt;
&lt;p&gt;D1 适合个人博客、小型 API、配置管理、原型项目、边缘地理位置需要低延迟的场景。不需要复杂查询和高并发，追求简单和免运维。&lt;/p&gt;
&lt;p&gt;PostgreSQL 适合需要事务完整性、复杂查询、高并发的项目：如电商系统、论坛、内容管理系统、数据分析后台等。如果已经有现成的 PG 应用迁移过来也更合适。&lt;/p&gt;</content:encoded></item><item><title>鸽鸽鸽~</title><link>https://blyciallo.com/posts/ge-ge-ge/</link><guid isPermaLink="true">https://blyciallo.com/posts/ge-ge-ge/</guid><description>鸽鸽鸽</description><pubDate>Wed, 26 Aug 2026 00:00:00 GMT</pubDate><content:encoded>&lt;p&gt;鸽鸽鸽鸽鸽鸽鸽鸽鸽鸽鸽鸽鸽鸽鸽鸽鸽鸽鸽鸽鸽&lt;/p&gt;</content:encoded></item><item><title>记一次博客收录优化：从 1 个页面到全部可收录</title><link>https://blyciallo.com/posts/ji-yi-ci-bo-ke-shou-lu-you-hua-cong-1-ge-ye-mian-dao-quan-bu-ke-shou-lu/</link><guid isPermaLink="true">https://blyciallo.com/posts/ji-yi-ci-bo-ke-shou-lu-you-hua-cong-1-ge-ye-mian-dao-quan-bu-ke-shou-lu/</guid><description>🌱 起因某天打开 Google Search Console</description><pubDate>Wed, 26 Aug 2026 00:00:00 GMT</pubDate><content:encoded>&lt;section&gt;&lt;h1&gt;🌸 记一次博客收录优化：从 1 个页面到全部可收录&lt;a href=&quot;#-记一次博客收录优化从-1-个页面到全部可收录&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h1&gt;&lt;blockquote&gt;&lt;p&gt;从只有首页被搜到，到全站文章都能被收录的实战记录～&lt;br /&gt;
分享排查 Google / Bing 收录问题的全过程：canonical 缺失、重复页面判定、meta description 雷同，以及 IndexNow 接入时踩过的各种坑。&lt;/p&gt;&lt;/blockquote&gt;&lt;hr /&gt;&lt;section&gt;&lt;h2&gt;🌱 起因&lt;a href=&quot;#-起因&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;某天打开 Google Search Console，看了一眼站点的收录情况，数据有点惨：&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;&lt;strong&gt;已索引页面&lt;/strong&gt;：只有 &lt;strong&gt;1 个&lt;/strong&gt;（首页）&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;未编入索引&lt;/strong&gt;：23 个&lt;/li&gt;
&lt;/ul&gt;&lt;p&gt;未索引的原因分三类：&lt;/p&gt;

&lt;table&gt;&lt;thead&gt;&lt;tr&gt;&lt;th&gt;原因&lt;/th&gt;&lt;th&gt;数量&lt;/th&gt;&lt;th&gt;说明&lt;/th&gt;&lt;/tr&gt;&lt;/thead&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td&gt;Crawled - currently not indexed&lt;/td&gt;&lt;td&gt;21&lt;/td&gt;&lt;td&gt;已抓取但未收录，新站常见&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;Duplicate without user-selected canonical&lt;/td&gt;&lt;td&gt;1&lt;/td&gt;&lt;td&gt;没有指定规范网页的重复内容&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;Not found (404)&lt;/td&gt;&lt;td&gt;1&lt;/td&gt;&lt;td&gt;&lt;code&gt;/posts/&lt;/code&gt; 返回 404&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;&lt;p&gt;最扎眼的是「&lt;strong&gt;Duplicate without user-selected canonical&lt;/strong&gt;」——全站居然&lt;strong&gt;没有任何 &lt;code&gt;&amp;lt;link rel=&quot;canonical&quot;&amp;gt;&lt;/code&gt; 标签&lt;/strong&gt;！&lt;/p&gt;&lt;p&gt;没有 canonical，Google 无法区分：&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;&lt;code&gt;https://blyciallo.com/&lt;/code&gt;&lt;/li&gt;
&lt;li&gt;不带斜杠的版本&lt;/li&gt;
&lt;li&gt;分页页、搜索参数变体&lt;/li&gt;
&lt;/ul&gt;&lt;p&gt;于是它只收录一个代表页（首页），其余全部被当成重复内容。&lt;/p&gt;&lt;hr /&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;🛠️ 修复一：补上 canonical&lt;a href=&quot;#️-修复一补上-canonical&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;在布局组件的 &lt;code&gt;&amp;lt;head&amp;gt;&lt;/code&gt; 里加一行：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&amp;lt;&lt;/span&gt;&lt;span&gt;link&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;rel&lt;/span&gt;&lt;span&gt;=&lt;/span&gt;&lt;span&gt;&quot;canonical&quot;&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;href&lt;/span&gt;&lt;span&gt;=&lt;/span&gt;&lt;span&gt;{Astro.url}&lt;/span&gt;&lt;span&gt; /&amp;gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;配合 Astro 的 &lt;code&gt;trailingSlash: &quot;always&quot;&lt;/code&gt;，输出的就是带斜杠的完整 URL，与 sitemap 保持一致。&lt;/p&gt;&lt;p&gt;这是一个纯声明式的修复，不影响页面显示，只影响搜索引擎对 URL 的判断。&lt;/p&gt;&lt;p&gt;修复后，无斜杠版本虽然在 Vercel 上同样返回 200，但页面内的 canonical 指向带斜杠版本，Google 会自动剔除重复 URL。&lt;/p&gt;&lt;hr /&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;🛡️ 修复二：robots.txt 屏蔽参数页&lt;a href=&quot;#️-修复二robotstxt-屏蔽参数页&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;&lt;code&gt;/archive/?tag=xxx&lt;/code&gt; 这类带查询参数的过滤页会被反复抓取，但永远不会被收录，纯浪费抓取配额。&lt;/p&gt;&lt;p&gt;在 &lt;code&gt;robots.txt&lt;/code&gt; 里加上：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;Disallow: /*?tag=&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;简单有效！&lt;/p&gt;&lt;hr /&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;📝 修复三：消除雷同的 meta description&lt;a href=&quot;#-修复三消除雷同的-meta-description&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;Bing 后台提示「太多页面使用相同的 meta description」。&lt;/p&gt;&lt;p&gt;原因是之前用的兜底逻辑：&lt;/p&gt;&lt;div&gt;&lt;figure&gt;&lt;figcaption&gt;&lt;/figcaption&gt;&lt;pre&gt;&lt;code&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;1&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;span&gt;description&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;/span&gt;&lt;span&gt;||&lt;/span&gt;&lt;span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;siteConfig&lt;/span&gt;&lt;span&gt;.&lt;/span&gt;&lt;/span&gt;&lt;span&gt;description&lt;/span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;||&lt;/span&gt;&lt;span&gt;&lt;span&gt; &lt;/span&gt;&lt;span&gt;pageTitle&lt;/span&gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/code&gt;&lt;/pre&gt;&lt;div&gt;&lt;div&gt;&lt;/div&gt;&lt;div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/figure&gt;&lt;/div&gt;&lt;p&gt;所有没写 description 的页面（归档、搜索、标签、分类页）全部退回到同一个站点描述。&lt;/p&gt;&lt;p&gt;&lt;strong&gt;修复方案：&lt;/strong&gt;&lt;/p&gt;&lt;ol&gt;
&lt;li&gt;&lt;strong&gt;文章页&lt;/strong&gt;：没有手写 description 时，兜底用正文第一段作为摘要（项目里本来就有 remark-excerpt 插件在生成 excerpt，只是没人用）&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;归档 / 搜索 / 标签 / 分类页&lt;/strong&gt;：各自补充独立的 description（走 i18n，六种语言都加了翻译）&lt;/li&gt;
&lt;/ol&gt;&lt;hr /&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;🚀 修复四：接入 IndexNow&lt;a href=&quot;#-修复四接入-indexnow&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;IndexNow 是一个开放协议，Bing、Yandex、Naver、Seznam 都支持。&lt;/p&gt;&lt;p&gt;网站根目录放一个 &lt;code&gt;&amp;lt;key&amp;gt;.txt&lt;/code&gt; 文件作为“地盘证明”，发布内容后主动向搜索引擎提交 URL，通常几小时到一两天内就会被抓取，不需要等爬虫慢慢来。&lt;/p&gt;&lt;p&gt;我做了三件事：&lt;/p&gt;&lt;ol&gt;
&lt;li&gt;生成一个 UUID 作为 key，写入 &lt;code&gt;public/&amp;lt;key&amp;gt;.txt&lt;/code&gt;（注意：&lt;strong&gt;文件内容不能有多余的换行符&lt;/strong&gt;，Bing 校验非常严格）&lt;/li&gt;
&lt;li&gt;写了一个构建后脚本 &lt;code&gt;scripts/indexnow.ts&lt;/code&gt;：读 sitemap 里的 URL，逐个端点提交&lt;/li&gt;
&lt;li&gt;接入 &lt;code&gt;pnpm build&lt;/code&gt; 最后一步，以后每次部署自动提交&lt;/li&gt;
&lt;/ol&gt;&lt;section&gt;&lt;h3&gt;踩坑记录 🕳️&lt;a href=&quot;#踩坑记录-️&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;p&gt;&lt;strong&gt;坑一：key 文件不能有换行符&lt;/strong&gt;&lt;br /&gt;
写入文件时默认带 &lt;code&gt;\n&lt;/code&gt;，Bing 验证 key 文件内容时严格比对，多余的换行符会导致验证失败（403）。&lt;/p&gt;&lt;p&gt;&lt;strong&gt;坑二：POST 接口 403，GET 接口正常&lt;/strong&gt;&lt;br /&gt;
相同的 key、相同的 URL，&lt;code&gt;POST https://api.indexnow.org/indexnow&lt;/code&gt; 稳定返回 403，改用 GET 请求则返回 202。&lt;/p&gt;&lt;p&gt;最终脚本改成对多个端点逐一提交：&lt;/p&gt;&lt;ul&gt;
&lt;li&gt;api.indexnow.org（Bing 聚合）&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;http://www.bing.com&quot; target=&quot;_blank&quot;&gt;www.bing.com&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;yandex.com&lt;/li&gt;
&lt;li&gt;searchadvisor.naver.com&lt;/li&gt;
&lt;li&gt;search.seznam.cz&lt;/li&gt;
&lt;/ul&gt;&lt;p&gt;实测同一 key：Yandex / Naver / Seznam 全部接受，只有 Bing 拒绝。&lt;/p&gt;&lt;p&gt;&lt;strong&gt;坑三：Bing 会把主机标记为“未授权”并缓存&lt;/strong&gt;&lt;br /&gt;
Bing 的验证器会异步验证 key 文件，一旦判定主机“未授权”（比如 key 文件还没上线就去提交），这个状态会被缓存。&lt;br /&gt;
&lt;strong&gt;换新 key 也绕不过去&lt;/strong&gt;，只能等缓存过期（最长 24 小时）或等待域名验证方式修正。&lt;/p&gt;&lt;p&gt;&lt;strong&gt;坑四：用“从 Google Search Console 导入”验证的域名，Bing 的 IndexNow 会拒绝&lt;/strong&gt;&lt;br /&gt;
在 Bing Webmaster Tools 里重新添加了站点，改用 XML 文件方式验证，之后 Bing 的 IndexNow 面板就能看到提交记录了（353 条）。&lt;/p&gt;&lt;p&gt;&lt;strong&gt;坑五：搜索引擎不解析 sitemap 索引文件&lt;/strong&gt;&lt;br /&gt;
先是在 Bing 上发现提交 &lt;code&gt;sitemap-index.xml&lt;/code&gt; 只发现 1 个 URL；后来发现 Google Search Console 也一样——读过一次索引后 “Sitemaps read” 一直为 0。&lt;/p&gt;&lt;p&gt;两个搜索引擎都改成&lt;strong&gt;直接提交 sitemap-0.xml&lt;/strong&gt; 后，Bing 和 Google 均成功发现 39 个 URL。&lt;/p&gt;&lt;hr /&gt;&lt;/section&gt;&lt;/section&gt;&lt;section&gt;&lt;h2&gt;🌈 现状与总结&lt;a href=&quot;#-现状与总结&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;ul&gt;
&lt;li&gt;&lt;strong&gt;Google 侧&lt;/strong&gt;：canonical、meta description、robots.txt 均已修复；sitemap-0.xml 已成功处理（39 个 URL）。剩下的交给时间（新站收录慢是正常的）&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Bing 侧&lt;/strong&gt;：网站地图 ✅（39 个 URL）、IndexNow ✅（353 条提交记录），Yandex / Naver / Seznam 也已收到提交&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;后续&lt;/strong&gt;：发新文章，部署时自动提交 IndexNow，无需手动操作&lt;/li&gt;
&lt;/ul&gt;&lt;section&gt;&lt;h3&gt;最大的感悟&lt;a href=&quot;#最大的感悟&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h3&gt;&lt;blockquote&gt;&lt;p&gt;&lt;strong&gt;SEO 里 90% 的问题都是“少了一行标签”。&lt;/strong&gt;&lt;/p&gt;&lt;/blockquote&gt;&lt;/section&gt;&lt;/section&gt;&lt;/section&gt;</content:encoded></item><item><title>测试</title><link>https://blyciallo.com/posts/ce-shi/</link><guid isPermaLink="true">https://blyciallo.com/posts/ce-shi/</guid><description>测试</description><pubDate>Tue, 11 Aug 2026 00:00:00 GMT</pubDate><content:encoded>&lt;p&gt;测试
1241412
1512512
咕咕嘎嘎
咕咕嘎嘎过&lt;/p&gt;</content:encoded></item><item><title>Markdown Mermaid 图表</title><link>https://blyciallo.com/posts/markdown-mermaid/</link><guid isPermaLink="true">https://blyciallo.com/posts/markdown-mermaid/</guid><description>一个包含 Mermaid 的 Markdown 博客文章简单示例。</description><pubDate>Thu, 01 Jan 1970 00:00:00 GMT</pubDate><content:encoded>&lt;section&gt;&lt;h2&gt;Markdown 中 Mermaid 图表完整指南&lt;a href=&quot;#markdown-中-mermaid-图表完整指南&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;本文演示如何在 Markdown 文档中使用 Mermaid 创建各种复杂图表，包括流程图、时序图、ER 图、类图、状态图、XY 图、甘特图、思维导图等。&lt;/p&gt;&lt;blockquote&gt;&lt;p&gt;Mermaid 图表由 &lt;a href=&quot;https://github.com/Latias94/merman&quot; target=&quot;_blank&quot;&gt;Merman&lt;/a&gt; 实现。Firefly 在 Astro 构建阶段生成亮色和深色两套静态 SVG，无需在浏览器中加载 Mermaid 渲染运行时。可以前往 &lt;a href=&quot;http://frankorz.com/merman/&quot; target=&quot;_blank&quot;&gt;Merman Playground&lt;/a&gt; 实时编辑语法并预览渲染结果。&lt;/p&gt;&lt;/blockquote&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;流程图示例&lt;a href=&quot;#流程图示例&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;流程图非常适合表示流程或算法步骤。&lt;/p&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;是&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;否&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;选项 1&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;选项 2&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;选项 3&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;子过程详情&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;子步骤 1&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;子步骤 2&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;子步骤 3&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;开始&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;条件检查&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;处理步骤 1&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;处理步骤 2&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;另一个决策&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;结果 1&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;结果 2&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;结果 3&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;结束&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;
&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;是&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;否&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;选项 1&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;选项 2&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;选项 3&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;子过程详情&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;子步骤 1&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;子步骤 2&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;子步骤 3&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;开始&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;条件检查&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;处理步骤 1&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;处理步骤 2&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;另一个决策&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;结果 1&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;结果 2&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;结果 3&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;结束&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;时序图示例&lt;a href=&quot;#时序图示例&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;时序图显示对象之间随时间的交互。&lt;/p&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;数据库服务器网页应用用户数据库服务器网页应用用户alt[认证成功][认证失败]提交登录请求发送认证请求查询用户凭据返回用户数据返回认证结果显示欢迎页面请求用户数据获取用户偏好返回偏好设置返回用户数据加载个性化界面显示错误消息提示重新输入
&lt;/div&gt;&lt;div&gt;数据库服务器网页应用用户数据库服务器网页应用用户alt[认证成功][认证失败]提交登录请求发送认证请求查询用户凭据返回用户数据返回认证结果显示欢迎页面请求用户数据获取用户偏好返回偏好设置返回用户数据加载个性化界面显示错误消息提示重新输入
&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;ER 图示例&lt;a href=&quot;#er-图示例&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;ER 图（实体关系图）非常适合表示数据库结构。&lt;/p&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;

&lt;div&gt;&lt;span&gt;&lt;p&gt;writes&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;posts&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;has&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;belongs to&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div&gt;&lt;span&gt;&lt;p&gt;USER&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;int&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;id&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;PK&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;string&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;username&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;string&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;email&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;datetime&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;created_at&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;ARTICLE&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;int&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;id&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;PK&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;string&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;title&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;text&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;content&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;datetime&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;published&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;int&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;author_id&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;FK&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;COMMENT&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;int&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;id&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;PK&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;text&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;content&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;datetime&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;created_at&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;int&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;user_id&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;FK&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;int&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;article_id&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;FK&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;CATEGORY&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;int&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;id&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;PK&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;string&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;name&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;string&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;description&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;

&lt;/div&gt;&lt;div&gt;

&lt;div&gt;&lt;span&gt;&lt;p&gt;writes&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;posts&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;has&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;belongs to&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;
&lt;div&gt;&lt;span&gt;&lt;p&gt;USER&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;int&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;id&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;PK&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;string&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;username&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;string&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;email&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;datetime&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;created_at&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;ARTICLE&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;int&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;id&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;PK&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;string&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;title&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;text&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;content&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;datetime&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;published&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;int&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;author_id&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;FK&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;COMMENT&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;int&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;id&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;PK&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;text&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;content&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;datetime&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;created_at&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;int&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;user_id&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;FK&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;int&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;article_id&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;FK&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;CATEGORY&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;int&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;id&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;PK&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;string&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;name&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;string&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;description&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;

&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;类图示例&lt;a href=&quot;#类图示例&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;类图显示系统的静态结构，包括类、属性、方法及其关系。&lt;/p&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;写作&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;发表&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;拥有&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;属于&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;1&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;1&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;1&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;1&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;*&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;*&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;*&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;*&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;User&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+String username&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+String password&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+String email&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+Boolean active&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+login()&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+logout()&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+updateProfile()&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;Article&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+String title&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+String content&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+Date publishDate&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+Boolean published&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+publish()&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+edit()&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+delete()&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;Comment&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+String content&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+Date commentDate&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+addComment()&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+deleteComment()&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;Category&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+String name&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+String description&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+addArticle()&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+removeArticle()&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;写作&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;发表&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;拥有&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;属于&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;1&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;1&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;1&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;1&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;*&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;*&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;*&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;*&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;User&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+String username&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+String password&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+String email&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+Boolean active&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+login()&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+logout()&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+updateProfile()&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;Article&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+String title&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+String content&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+Date publishDate&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+Boolean published&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+publish()&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+edit()&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+delete()&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;Comment&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+String content&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+Date commentDate&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+addComment()&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+deleteComment()&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;Category&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+String name&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+String description&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+addArticle()&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;+removeArticle()&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;状态图示例&lt;a href=&quot;#状态图示例&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;状态图显示对象在其生命周期中经历的状态序列。&lt;/p&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;提交&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;拒绝&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;批准&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;发布&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;归档&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;撤回&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;草稿&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;审核中&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;已批准&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;已归档&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;已发布&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;临时隐藏&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;恢复&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;活跃&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;隐藏&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;
&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;提交&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;拒绝&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;批准&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;发布&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;归档&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;撤回&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;草稿&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;审核中&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;已批准&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;已归档&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;已发布&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;临时隐藏&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;恢复&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;活跃&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;隐藏&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;XY 图示例&lt;a href=&quot;#xy-图示例&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;XY 图表非常适合展示趋势和对比数据。&lt;/p&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;月度访问量趋势1月2月3月4月5月6月5000450040003500300025002000150010005000访问量
&lt;/div&gt;&lt;div&gt;月度访问量趋势1月2月3月4月5月6月5000450040003500300025002000150010005000访问量
&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;饼图示例&lt;a href=&quot;#饼图示例&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;饼图适合直观展示各部分在整体中的占比。&lt;/p&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;45%30%15%10%内容类型占比技术文章 [45]项目记录 [30]生活随笔 [15]其他 [10]
&lt;/div&gt;&lt;div&gt;45%30%15%10%内容类型占比技术文章 [45]项目记录 [30]生活随笔 [15]其他 [10]
&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;甘特图示例&lt;a href=&quot;#甘特图示例&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;甘特图可以按时间轴展示项目阶段、任务依赖和当前进度。&lt;/p&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;07/0107/0307/0507/0707/0907/1107/1307/1507/17需求整理 视觉设计 功能实现 内容迁移 构建检查 正式上线 准备开发发布博客版本发布计划
&lt;/div&gt;&lt;div&gt;07/0107/0307/0507/0707/0907/1107/1307/1507/17需求整理 视觉设计 功能实现 内容迁移 构建检查 正式上线 准备开发发布博客版本发布计划
&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;思维导图示例&lt;a href=&quot;#思维导图示例&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;思维导图适合梳理主题层级和知识结构。&lt;/p&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;Firefly&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;内容&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;技术文章&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;生活记录&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;体验&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;搜索&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;深色模式&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;图表&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;工程&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;Astro&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;Svelte&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;Merman&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;
&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;Firefly&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;内容&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;技术文章&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;生活记录&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;体验&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;搜索&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;深色模式&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;图表&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;工程&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;Astro&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;Svelte&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;Merman&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;时间线示例&lt;a href=&quot;#时间线示例&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;时间线用于按年份或阶段呈现项目的重要事件。&lt;/p&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;2024建立博客完成基础主题2025加入搜索与图库完善内容系统2026升级   Astro   7使用   Merman   渲染图表Firefly 演进时间线
&lt;/div&gt;&lt;div&gt;2024建立博客完成基础主题2025加入搜索与图库完善内容系统2026升级   Astro   7使用   Merman   渲染图表Firefly 演进时间线
&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;用户旅程图示例&lt;a href=&quot;#用户旅程图示例&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;用户旅程图能够描述用户在不同阶段的行为和体验评分。&lt;/p&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;读者&lt;div&gt;&lt;div&gt;发现内容&lt;/div&gt;&lt;/div&gt;发现内容读者&lt;div&gt;&lt;div&gt;      打开首页&lt;/div&gt;&lt;/div&gt;      打开首页读者&lt;div&gt;&lt;div&gt;      搜索主题&lt;/div&gt;&lt;/div&gt;      搜索主题&lt;div&gt;&lt;div&gt;阅读文章&lt;/div&gt;&lt;/div&gt;阅读文章读者&lt;div&gt;&lt;div&gt;      浏览正文&lt;/div&gt;&lt;/div&gt;      浏览正文读者&lt;div&gt;&lt;div&gt;      查看图表&lt;/div&gt;&lt;/div&gt;      查看图表&lt;div&gt;&lt;div&gt;继续探索&lt;/div&gt;&lt;/div&gt;继续探索读者&lt;div&gt;&lt;div&gt;      查看相关文章&lt;/div&gt;&lt;/div&gt;      查看相关文章读者&lt;div&gt;&lt;div&gt;      分享文章&lt;/div&gt;&lt;/div&gt;      分享文章读者浏览文章的旅程
&lt;/div&gt;&lt;div&gt;读者&lt;div&gt;&lt;div&gt;发现内容&lt;/div&gt;&lt;/div&gt;发现内容读者&lt;div&gt;&lt;div&gt;      打开首页&lt;/div&gt;&lt;/div&gt;      打开首页读者&lt;div&gt;&lt;div&gt;      搜索主题&lt;/div&gt;&lt;/div&gt;      搜索主题&lt;div&gt;&lt;div&gt;阅读文章&lt;/div&gt;&lt;/div&gt;阅读文章读者&lt;div&gt;&lt;div&gt;      浏览正文&lt;/div&gt;&lt;/div&gt;      浏览正文读者&lt;div&gt;&lt;div&gt;      查看图表&lt;/div&gt;&lt;/div&gt;      查看图表&lt;div&gt;&lt;div&gt;继续探索&lt;/div&gt;&lt;/div&gt;继续探索读者&lt;div&gt;&lt;div&gt;      查看相关文章&lt;/div&gt;&lt;/div&gt;      查看相关文章读者&lt;div&gt;&lt;div&gt;      分享文章&lt;/div&gt;&lt;/div&gt;      分享文章读者浏览文章的旅程
&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;Git 图示例&lt;a href=&quot;#git-图示例&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;Git 图可以清晰展示分支、提交和合并历史。&lt;/p&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;mainfeatureinitadd-diagramspolish-themesmerge-featurerelease
&lt;/div&gt;&lt;div&gt;mainfeatureinitadd-diagramspolish-themesmerge-featurerelease
&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;看板示例&lt;a href=&quot;#看板示例&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;看板适合展示任务在不同工作阶段之间的分布。&lt;/p&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;待办&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;进行中&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;已完成&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;整理需求&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;准备示例&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;接入 Merman&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;服务端渲染&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;亮暗主题&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;/div&gt;&lt;div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;待办&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;进行中&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;已完成&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;整理需求&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;准备示例&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;接入 Merman&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;服务端渲染&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;p&gt;亮暗主题&lt;/p&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;&lt;div&gt;&lt;span&gt;&lt;/span&gt;&lt;/div&gt;
&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;Sankey 图示例&lt;a href=&quot;#sankey-图示例&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;Sankey 图通过连线宽度展示流量在不同节点之间的流向。&lt;/p&gt;&lt;div&gt;&lt;div&gt;&lt;div&gt;Home
1650Post list
1200Search
450Post detail
1220Related posts
260External shares
180&lt;/div&gt;&lt;div&gt;Home
1650Post list
1200Search
450Post detail
1220Related posts
260External shares
180&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;&lt;/section&gt;
&lt;section&gt;&lt;h2&gt;总结&lt;a href=&quot;#总结&quot;&gt;&lt;span&gt;#&lt;/span&gt;&lt;/a&gt;&lt;/h2&gt;&lt;p&gt;Mermaid 是在 Markdown 文档中创建各种类型图表的强大工具。本文演示了流程图、时序图、ER 图、类图、状态图、XY 图、饼图、甘特图、思维导图、时间线、用户旅程图、Git 图、看板和 Sankey 图。这些图表可以帮助您更清晰地表达复杂的概念、流程和数据结构。&lt;/p&gt;&lt;p&gt;要使用 Mermaid，只需在代码块中指定 mermaid 语言，并使用简洁的文本语法描述图表。图表会在构建时自动渲染为 SVG，无需客户端 JavaScript 加载。&lt;/p&gt;&lt;p&gt;可以前往 &lt;a href=&quot;http://frankorz.com/merman/&quot; target=&quot;_blank&quot;&gt;Merman Playground&lt;/a&gt; 尝试更多语法，再将图表代码粘贴到文章中。&lt;/p&gt;&lt;/section&gt;</content:encoded></item></channel></rss>