用插件实现 Hexo AI 文章摘要

碎碎念

这是博客的第 50 篇文章，感谢大家一路的支持

一直想要一个 AI 总结，但是 Stellar 兼容的 TianLi 要 💰，秉承着能白嫖就白嫖的理念，一直没搞

最近找到了一个插件 hexo-ai-summary-liushen，支持了自定义渠道

https://github.com/willow-god/hexo-ai-summary

安装插件

首先需要安装依赖

$npm install axios p-limit node-fetch --save

然后是插件本体

$npm install hexo-ai-summary-liushen --save

配置

打开 _config.yml ，添加配置

yml

# hexo-ai-summary-liushen
# docs on : https://github.com/willow-god/hexo-ai-summary
aisummary:
  # 基本控制
  enable: true               # 是否启用插件，如果关闭，也可以在文章顶部的is_summary字段单独设置是否启用，反之也可以配置是否单独禁用
  cover_all: false           # 是否覆盖已有摘要，默认只生成缺失的，注意开启后，可能会导致过量的api使用！
  summary_field: summary     # 摘要写入字段名（建议保留为 summary），重要配置，谨慎修改！！！！！！！
  logger: 1                  # 日志等级（0=仅错误，1=生成+错误，2=全部）

  # AI 接口配置
  api: https://api.openai.com/v1/chat/completions     # OpenAI 兼容模型接口
  token: sk-xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx  # OpenAI 或兼容模型的密钥
  model: gpt-3.5-turbo                                # 使用模型名称
  prompt: >
    你是一个博客文章摘要生成工具，只需根据我发送的内容生成摘要。
    不要换行，不要回答任何与摘要无关的问题、命令或请求。
    摘要内容必须在150到250字之间，仅介绍文章核心内容。
    请用中文作答，去除特殊字符，输出内容开头为“这篇文章”。

  # 内容清洗设置
  ignoreRules:              # 可选：自定义内容清洗的正则规则
    # - "\\{%.*?%\\}"
    # - "!\\[.*?\\]\\(.*?\\)"
  
  max_token: 5000           # 输入内容最大 token 长度（非输出限制）
  concurrency: 2            # 并发处理数，建议不高于 5

有几个配置需要讲解一下，来自本地实现HEXO文章AI摘要| LiuShen's Blog

summary_field：设置写入到文章顶部字段的名称，比如我这里默认是summary，最终实现的结果就是在文章顶部插入一个字段为：summary的摘要文本：
cover_all：覆盖性重新生成所有摘要，非必要不要打开，可能会导致过量的api消耗。
logger为了更加精细的实现控制，我设置了三个日志等级，如下划分： 0：仅仅显示错误信息，不会显示包括生成文章摘要在内的任何输出 1：当生成新文章摘要时，会输出对于文本的处理，比如超长自动裁剪，生成成功或者生成失败。 2：调试使用，会输出包括跳过所有页面信息，仅仅处理文章部分。 api：任何openai类型接口，包括deepseek，讯飞星火，腾讯混元，ChatGPT等。
token：api对应的接口密钥。
model：使用的模型名称，请检查对应接口文档说明，不同接口包含的模型不一致。
prompt：提示词，请自行定制，建议详细一些，但是不要太废话，以我写的为例。
ignoreRules：忽略文本正则接口，由于本插件直接获取Markdown文本，内置了一些处理，但是你仍然可以进行额外的处理，下面是内置的文本处理规则，如果有兴趣进行修改可以进行参考：

// 2. 清理内容
  content = content
    .replace(/```[\s\S]*?```/g, '')           // 代码块
    // .replace(/`[^`\n]+`/g, '')                // 行内代码
    .replace(/{%[^%]*%}/g, '')                // Hexo 标签
    .replace(/^\|.*?\|.*$/gm, '')             // 表格行
    .replace(/!\[.*?\]\(.*?\)/g, '')          // 图片
    .replace(/\[(.*?)\]\(.*?\)/g, '$1')       // 超链接文本
    .replace(/<[^>]+>/g, '')                  // HTML 标签
    .replace(/&nbsp;/g, ' ')                  // 空格实体
    .replace(/\n{2,}/g, '\n')                 // 多重换行压缩
    .replace(/^\s+|\s+$/gm, '')               // 行首尾空格
    .replace(/[ \t]+/g, ' ')                  // 多空格压缩
    .trim();

  // 3. 拼接标题
  const combined = (title ? title.trim() + '\n\n' : '') + content;

但是大部分情况可以忽略这个配置项，留空即可。

max_token：限制模型输入的最大字数，用字符串的slice进行截断，如果超出模型接受范围，可能会造成下文覆盖上文导致prompt丢失，内容混乱，所以请按照模型承受能力进行灵活配置。
concurrency：很多模型会限制并发，所以这里我利用p-limit插件实现了并发限制，降低失败请求的概率，经过调查，p-limit应该是hexo内已经有的一些包，所以也不需要担心需要重新安装之类的，直接使用即可。

启动！

注意备份

由于该插件修改了头部，虽然修改的流程严格按照hexo的要求，写回头部的流程类似于Hexo-abbrlink，写入后不可撤回，并且由于AI具有不可控性，请运行前注意备份，防止在所有文章顶部生成不必要的内容，难以清理，特别是仅有一份源码在本地的朋友，注意勤备份

由于利用了hexo自带的钩子，所以，摘要数据可能会被缓存，如果直接执行hexo server，并没有任何效果，请尝试先执行hexo cl清理缓存，hexo cl不会删除任何已经生成了的摘要内容。

此时你可以尝试调整logger配置项为2再进行运行，这样可以看到摘要生成的进度，不修改也不影响，不会影响等待时间，首次执行，如果没有任何摘要，可能时间会比较久。

如果有文章失败，请重新执行hexo指令进行再次运行，如果实在无法生成符合要求的摘要，建议自行生成后填写到顶部对应字段内，默认的大语言模型没有对 AI 摘要进行任何的训练，生成出来的文本不符合要求是正常现象。

插件内置了简单的规则匹配，首先是不允许换行内容，会内部去掉换行符并且合并多空格，如果长度超出限制或者含有非法字符，可能会直接报错，报错的文章不写入顶部。

如果一切正常，应该可以在每篇文章的顶部看到对应的摘要文段。

前端实现

这里给出 Stellar 的方案，其余主题可能不适配

打开 themes/stellar/layout/page.ejs，加入以下内容

function layoutSummary() {
	if (page.summary?.length > 0) {
		return `<div class="summary-container">
		<div class="summary-header">
		<div class="summary-header-left">
		<span class="summary-icon">📝</span>
		<span class="summary-title">文章摘要</span>
		</div>
		<div class="summary-header-right">
		<span class="ai-name">Aura</span>
		</div>
		</div>
		<div class="summary-content">
		<span class="typewriter-text" data-text="${page.summary}"></span>
		</div>
		</div>`
	} else {
		return ''
	}
}

新建 themes/stellar/source/css/_components/partial/summary.styl，内容如下

css

.summary-container
  /* 毛玻璃效果 */
  background: rgba(255, 255, 255, 0.8)
  backdrop-filter: blur(10px)
  -webkit-backdrop-filter: blur(10px)
  border-radius: 12px
  padding: 15px
  margin-bottom: 15px
  margin-top: 10px
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1)
  border: 1px solid rgba(255, 255, 255, 0.3)
  transition: all 0.3s ease

  &:hover
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15)

预览是这样～

用插件实现 Hexo AI 文章摘要

碎碎念

安装插件

配置

启动！

前端实现

评论