Qihua's Blog

Personal Blog

0%

Agent热点追踪项目

Posted on In

Agent热点追踪项目

前言

原项目是写在公司自有平台上的，平台的MEP项目，底层类似一个后端服务给你写好的，你直接在此基础上写进程和线程就行。ai api调用也是公司内部的，glm5.2，部分mcp也是改写的，恕在此无法展示。

但总思路是一致的，用agent的mcp工具去抓热点新闻，再调用api去判断新闻内容，给内容打分，给热度打分，最后再从新闻标题中挑选热词，这部分全部交给api，最后记录热点新闻和热词两部分内容。

这里上传github的项目是重做的，带着整个前后端的，全程由牛逼的codex生成。

项目链接：Agent热点追踪项目

前期准备

部分api和工具要提前准备：

  1. OpenRouter API：agent需要调用的api
  2. twitter API：抓取twitter新闻用的，也要付费
  3. Firecrawl：爬虫mcp
  4. Context7：读最新文档用的mcp，调用接口和api用
  5. UI UX Pro Max：美化前端的skill
  6. Skill Creator：总结生成skill用

Vibe-coding

给codex说需求，ai给出的方案：

热点监控工具-设计方案

层级 技术 理由
前端 React + Vite + TailwindCSS 快速开发、响位式、独特 UI
后端 Node.js + Express 轻量、快速
数据存储 Prisma + SQLite 轻量级、无需额外配置

新闻抓取的api来源：twitter api，bing search api，微博/b站 api

然后ai会有一堆方案确认，化身yes工程师照着一个个回答和allow就完事了。记得让ai沉淀markdown文档。

初版功能验收清单：

  1. 仪表盘 - 显示热点统计和最新热点列表
  2. 关键词管理-添加/删除/启用/禁用监控关键词
  3. 搜索-手动搜索热点内容
  4. 立即检查 - 手动触发热点抓取
  5. 通知 -右上角通知铃铛，实时推送新热点

这里记得.env文件不要直接用，创建一个测试env。出版功能验证后，记得git一下代码再做后续。

ai问新闻标题审核流程，跟他说的时候有条理一点：

  1. 真实性判断：Al判断这条信息是否真实可信（过滤标题党、假消息）
  2. 相关性评分：Al给出 0-100 分相关性评分，表示与监控关键词匹配度
  3. 重要性分级：分为 urgent（紧急）、high（高）、medium（中）、low（低）四个等级
  4. 摘要生成：AI自动生成简洁的中文摘要，方便快速阅读

流程：原始信息→ AI分析→真实性判断→相关性评分→重要性分级→摘要生成

几乎是一把过了：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
hotnews-monitor/
├── server/                 # 后端项目
│   ├── src/
│   │   ├── routes/         # API 路由
│   │   ├── services/       # 业务逻辑（采集、分析、通知等）
│   │   ├── prisma/         # 数据库模型定义
│   │   └── index.ts        # 入口文件
│   ├── .env                # 环境变量（敏感信息）
│   └── package.json
├── client/                 # 前端项目
│   ├── src/
│   │   ├── components/     # React 组件
│   │   ├── pages/          # 页面
│   │   └── App.tsx         # 根组件
│   └── package.json
└── docs/                   # 项目文档

优化1: 前端页面

前端页面一打开ai味太冲了，优化一波，可能是由于ai前端祖传的TailwindCSS。

这里就要用到UI UX Pro Max这个skill了，先让他用contest7好好读最新文档，然后告诉他用高端一点的组件库：Aceternity UI，prompt语句写好约束和思路：

  1. 指定色彩方案：不要让 AI自由发挥，明确告诉它用什么颜色
  2. 使用特定 UI库：比如 Aceternity UI，它有独特视觉风格
  3. 注入情感和场景：告诉 AI你产品是什么调性（科技感、极客风等）
  4. 使用前端美化技能：让 Al参考专业 UI/UX 设计规范

这步优化前记得清一下上下文，省点token。可以反复做炼金看看效果，记得git保存版本。

优化2: 信息获取来源

初始版本只有twitter api 和 bing api，twitter api的来源质量还有点低。

现在需要：

  1. 强化twitter和bing来源的内容过滤
  2. 增加国内源：微博热搜，b站api

跟ai讨论一下方案后：

问题 1:Twitter 信息质量过滤
过滤维度 建议阈值 说明
最低点赞数 ≥ 10 过滤无人关注的随机帖子
最低转发数 ≥ 5 有传播价值的内容
最低浏览量 ≥ 500 有一定关注度
作者粉丝数 ≥ 100 排除僵尸/新号
认证优先 蓝V 加权 可信度更高
排除回复推文 过滤reply 类型 只保留原创推文
问题2：扩展信息来源
数据源 实现方式 特点
Bing 已实现 稳定，国内可用
Google 已实现 需启用，可能被封
DuckDuckGo 新增 无需 APl，反爬虫弱
Hacker News 新增 Al/技术热点专业来源
Reddit 新增（可选） 技术社区讨论
国内新闻源 新增 微博爬虫，b站api

在新增搜索引擎数据源时，AI使用了 Axios+ Cheerio 的爬虫方案：

  • Axios：一个流行 HTTP 请求库，用于发送 GET/POST 请求获取网页 HTML
  • Cheerio：一个轻量级的 HTML 解析库，提供了类似jQuery API来提取页面元素

工作流程：

发送 HTTP 请求获取网页 HTML→ Cheerio解析 HTML→提取搜索结果（标题、链接、描述）→返回结构化数据

爬虫用来应对微博和搜狗热搜，多轮迭代优化后，效果好很多了。看到ai卡住，反复优化同一个点的时候，记得手动停一停。

告诉ai，在数据采集阶段，应该尽可能拓宽搜索范围，不要过早过滤。过滤应该分层进行，明确告诉ai最后结果 质量>数量：

  1. 第一层：基础过滤（去重、时间窗口、格式校验）
  2. 第二层：质量过滤（社交指标、作者信誉）
  3. 第三层：AI深度分析（真假识别、相关性评分）

数据采集（尽量多）→基础过滤（去重、时间）→ AI 深度分析（相关性、真假）→最终展示

优化3: 信息筛选排序

现在前端展示页面是竖直排列，获取到的热点全都堆在一起，不利于人工检索，因此希望能够对帖子进行筛选和排序。

当系统从 8+ 个信息源采集数据后，一次扫描可能产生几十甚至上百条结果。如果所有内容平铺展示，用户需要逐条阅读才能找到有价值的信息，效率很低。

选和排序解决了两个核心问题：

  1. 信息过载：通过筛选条件缩小范围，快速找到特定类型信息
  2. 优先级判断：通过排序将最有价值的信息排在最前面

这在信息系统设计中是一个经典需求，类似于电商网站的商品筛选、新闻客户端内容排序。跟ai讨论后确定方案：

维度 可选值 说明
信息来源 Twitter / Bing / HackerNews／搜狗／B站等 按来源过滤
重要性 urgent / high / medium / low 按 AI判定的重要性级别过滤
关键词 用户配置的所有关键词 按监控关键词过滤
时间范围 最近1小时／6小时／24小时／7天／全部 按发现时间过滤
排序 规则 说明
热度综合 综合点赞、转发、浏览量等指标 社交热度最高的排在前面
相关性 按AI评分排序 与关键词最相关的排在前面
最新发布 按帖子原始发布时间排序 最新发布的排在前面
最新发现 按系统抓取时间排序 最新被系统发现的排在前面
重要程度 按AI判定重要性排序 最紧急重要的排在前面

筛选排序技术实现

筛选排序功能涉及前后端协同：

后端实现要点：

  • 将筛选参数作为 API查询参数
  • 使用 Prisma的 where 子句实现筛选
  • 使用Prisma的 orderBy 子句实现排序
  • 热度综合排序需要自定义排序逻辑（综合多个指标计算得分）

前端实现要点：

  • 使用下拉菜单或标签组件展示选选项
  • 筛选条件变化时重新请求后端 API
  • 保持 URL 参数与筛选状态同步（方便分享链接）
  • 加载状态和空结果的友好提示

分页实现：

  • 后端支持 page 和 pagesize 参数
  • 前端实现“加载更多”按钮
  • 切换筛选/排序条件时重置页码

可以顺便让ai写一下单元测试，避免不可维护。大功告成

优化4: 优化热点信息展示

目前只是有一部分信息的展示，好的信息展示应该遵循“一眼值不值”原则，用户只需要看一眼，就能判断这条信息是否值得深入阅读。要实现这一点，需要在有限的展示空间内提供 关键决策信息。跟ai讨论了一下，大致需要一下几个点：

决策维度 对应信息 为什么重要
时效性 发布时间、抓取时间 判断信息是否过时
热度 点赞、转发、浏览量 判断信息的关注度
可信度 作者信息、认证状态 判断信息来源是否可信
相关性 AI 相关性评分和理由 判断信息是否与关注话题相关
原文链接 一键跳转 方便深入阅读原始内容

最后要补充的点：帖子发布时间，系统抓取时间，更多互动数据，Al 相关性理由，作者信息，原始内容展开，真实性标记，热度综合指标，相对时间显示，总结给ai

新功能 说明
发布时间 显示“发布X小时前”，hover显示完整日期
抓取时间 显示“抓取X分钟前”，hover显示完整日期
互动数据 点赞/转发/回复/评论/引用/浏览量/弹幕，有则显示
Al 分析理由 可展开/折叠，含”一键展开/折叠所有“按钮
作者信息 头像、名称、＠用户名、认证标记、粉丝数
原始内容 可折叠展开查看原始描述
AI 摘要标注 summary 前显示”AI 摘要”标签
真实性标记 可疑内容显示红色“可疑”，高相关性显示绿色”可信”
热度综合指标 基于多维互动数据的综合热度分（爆/热/温/凉/冷）
相对时间 所有时间均使用“X小时前“格式，hover 可见完整时间

包括一些后端改造：

  1. 数据采集阶段：在抓取信息时，同时获取互动数据（点赞、转发、浏览量等）

  2. 数据存储：在 Prisma 数据模型中增加对应字段

  3. API响应：在返回给前端数据中包含新增字段

不同信息源提供的互动数据格式不同，需要统一处理。这是更改前后对比

优化前 优化后
只有标题和描述 标题+描述+发布时间+抓取时间
只显示点赞数 点赞、转发、回复、浏览量等完整互动数据
无分析理由 AI 相关性分析理由，支持展开/折叠
无作者信息 作者名称、认证状态
需要跳转查看详情 关键信息一目了然

优化5: AI分析准确度提升&关键词扩展搜索

又发现问题，AI筛选的内容，跟关键词的关联度不够，至少人看是这样。可能原因是：搜索引擎返回的内容本身就不够相关，关键词过于宽泛或模糊。给 AI的分析提示词不够精确，相关性评分的阈值设置不合理，无法量化分析质量。

与ai讨论方案后，加入关联性判断和Query Expansion（查询扩展）

首先关联性判断是因为原Prompt 要求“生成简短摘要”，AI自然只会介绍内容概要，而不会说明“这篇内容跟你搜索的关键词有什么关系”，现更改prompt明确要求。方法是强化prompt规范：

  1. 要求说明关联关系：AI 不仅要给分数，还要解释为什么觉得相关
  2. 增加 keywordMentioned 字段：明确标记内容中是否直接提到了关键词
  3. 区分直接相关和间接相关：比如“Claude 4.6发布”是直接相关，而“AI 编程工具对比”是间接相关

其次Query Expansion是因为有用到基础文本匹配过滤，也就是说内容必须要包含关键词，可能就会导致有些相似合理内容也被错误过滤了，所以我们可以用 Query Expand查询扩展。

Query Expansion（查询扩展）是信息检索领域的一项经典技术，其核心思想是将用户的原始查询自动扩展为多个语义相近的变体查询，从而提高检索 召回率。这里也是直接调用api来进行扩展判断：

方面 传统方法 AI 驱动方法（本项目）
扩展方 式 同义词词典、词干提取 AI 大模型理解语义并生成变体
灵活性 受限于预定义词典 可以理解上下文和领域知识
举例 “AI” → “Artificial Intelligence” “Claude 4.6” → “Claude Sonnet 4.6”, “Anthropic Claude updat e”、”Claude 新版本“
适用场 景 通用搜索 特定领域、多语言环境

流程大概是：用户输入关键词 → AI 生成查询变体列表 → 用所有变体并行搜索 → 合并去重结果 → AI 分析相关性

接着就是让ai开发了，判断阈值可以反复让ai调试后，看效果，来决定最终版本。

正常公司项目判断是要将准确率，召回率和f1值的，这里没有标注和测试团队，所以人工看一看吧。所谓人工智能，不得是既有人工，还有智能吗！[doge]

One More Things

玩一下，将项目封装skills，以后可以给别的大模型调用。

agent skill就是给 AI准备技能包，让 AI快速学习使用各种专业技能，而不用每次都重复输入提示词、编写脚本等等。本质是一组 结构化指令和资源，用于教会 AI完成特定任务。

1
2
3
4
5
6
7
skills/pptx/
├── SKILL.md          # 技能说明书（必需）
├── ooxml/            # OOXML 相关资源
├── scripts/          # 处理脚本
├── html2pptx.md      # HTML 转 PPT 说明
├── ooxml.md          # OOXML 格式说明
└── LICENSE.txt       # 许可证

我们想把这个做好的项目，让ai用skill-creator总结成skill，把 AI热点监控能力封装成 Agent Skills 技能，能够交给其他的 Al来监控和发现热点。

SKILL. md 是 Skils中最重要的文件，AI 编程工具在启动时会扫描已安装的 Skils，将 SKILL.md的内容加载到记忆中。当用户输入匹配触发条件时，AI就会自动激活对应的技能。

这里是直接跟ai说把项目封装成skill来做，要注意两点：

  1. 确保动用skill-creator这个skill在做
  2. 不要让ai封装项目前后端，然后写调用封装的skill。要让ai总结项目思路，然后写python流程。我们要让别的ai工具读到skill直接开始干活，而不是开始装一堆环境。

告诉ai后：

对比维度 旧方案（依赖 Server） 新方案（完全自包含）
安装难度 需要启动后端服务 复制文件夹即可
依赖项 Node.js+ 数据库 + OpenRouter 仅需 Python（可选）
AI 分析 通过 OpenRouter API调用 AI编程工具自身完成分析
搜索能力 调用后端 API 内置 Python 搜索脚本
可移植性 只能在有服务器环境使用 任何地方都能用

新方案的核心创新点是 Claude 即 AI引擎，不需要额外调用 OpenRouter，而是让 AI编程工具自身（比如 Claude、Copilot 中的模型）来完成内容分析。这样做好处：：

  1. 不需要用户额外配置 API Key
  2. 不产生额外 AI调用费用
  3. 分析质量取决于用户使用 Al模型

确定方案开始执行，基本就是一把过了，没有难度。用别的ai调用的时候（比如：claud或codex）记得把ai生成的skill包，放到这些工具的对应目录下，再测试。