AI 摘要实现

1
/**
2
 * 判断文章是否已有 description（只检查 frontmatter 区块内，且值不能为空）
3
 */
4
function hasDescription(raw: string): boolean {
5
  const parsed = parseFrontmatter(raw);
6
  if (!parsed) return false;
7

8
  const descMatch = parsed.frontmatter.match(/^description\s*:\s*(.+)$/m);
9
  if (!descMatch) return false;
10

11
  let value = descMatch[1].trim();
12
  // 去掉引号
13
  if ((value.startsWith('"') && value.endsWith('"')) || (value.startsWith("'") && value.endsWith("'"))) {
14
    value = value.slice(1, -1);
15
  }
16

17
  return value.length > 0;
18
}

1
function extractContext(body: string, maxChars: number): string {
2
  const cleaned = body
3
    .replace(/^---[\s\S]*?---\n?/, "")           // 去掉 frontmatter
4
    .replace(/#{1,6}\s+/g, "")                   // 去掉标题标记
5
    .replace(/```[\s\S]*?```/g, "[代码块]")       // 代码块替换
6
    .replace(/`[^`]+`/g, "[代码]")               // 行内代码替换
7
    .replace(/!\[.*?\]\(.*?\)/g, "")             // 去掉图片
8
    .replace(/\[([^\]]*)\]\(.*?\)/g, "$1")       // 保留链接文字
9
    .replace(/\n{3,}/g, "\n\n")                  // 压缩空行
10
    .trim();
11

12
  return cleaned.length > maxChars
13
    ? `${cleaned.slice(0, maxChars)}...`
14
    : cleaned;
15
}

1
const resp = await fetch(`${QWEN_BASE_URL}/chat/completions`, {
2
  method: "POST",
3
  headers: {
4
    "Content-Type": "application/json",
5
    Authorization: `Bearer ${QWEN_API_KEY}`,
6
  },
7
  body: JSON.stringify({
8
    model: QWEN_MODEL,
9
    messages: [
10
      { role: "system", content: SYSTEM_PROMPT },
11
      { role: "user", content: userMsg },
12
    ],
13
    temperature: 0.75,
14
    max_tokens: 256,
15
  }),
16
});

1
<div class="ai-summary-wrapper rounded-xl mb-6">
2
  <div class="ai-summary">
3
    <div class="ai-summary-inner">
4
      <div class="ai-summary-header">
5
        <div class="ai-summary-icon">
6
          <Icon name={iconName} class="text-base" />
7
        </div>
8
        <span class="ai-summary-label">{sourceLabel}</span>
9
      </div>
10
      <p
11
        class="ai-summary-text js-ai-summary-text"
12
        data-full-text={description}
13
      ></p>
14
    </div>
15
  </div>
16
</div>

1
(function initAiSummaryTypewriter() {
2
  function run() {
3
    const el = document.querySelector(".js-ai-summary-text");
4
    if (!el || el.dataset.typingInit === "1") return;
5
    el.dataset.typingInit = "1";
6

7
    const fullText = el.getAttribute("data-full-text") || "";
8

9
    // 无障碍：减少动态效果
10
    if (window.matchMedia("(prefers-reduced-motion: reduce)").matches) {
11
      el.textContent = fullText;
12
      return;
13
    }
14

15
    let hasRun = false;
16
    const speed = 45;
17

18
    const observer = new IntersectionObserver(
19
      (entries) => {
20
        for (const entry of entries) {
21
          if (entry.isIntersecting && !hasRun) {
22
            hasRun = true;
23
            observer.unobserve(el);
24
            startTyping(el, fullText, speed);
25
          }
26
        }
27
      },
28
      { threshold: 0.3 },
29
    );
30

31
    observer.observe(el);
32
  }
33

34
  run();
35
  document.addEventListener("astro:page-load", run);
36
})();