安知鱼主题:记一次鱼塘朋友圈钓鱼报错的修复

​ 前段时间,Hexo-Circle-of-Friends 项目恢复了更新和维护。我在将其升级至 v6.x.x 版本后,发现安知鱼主题中的 鱼塘朋友圈钓鱼功能 出现了问题 ———— 原本可以正常显示的随机友链文章功能,升级后却报出 undefined 错误。

🔍问题定位

​ 排查后发现,插件更新导致 /randompost 接口返回的 JSON 结构发生变化

根据最新的官方文档明:

  • 更新前:接口返回的 JSON 数据格式为对象,例如:
1
2
3
4
5
6
7
8
9
10
{
"title": "文章标题",
"created": "创建日期",
"updated": "更新日期",
"link": "https://example.com",
"rule": "feed",
"author": "作者",
"avatar": "头像地址",
"createdAt": "生成时间"
}
  • 更新后:即使只请求一篇文章,也以数组形式返回,例如:
1
2
3
4
5
6
7
8
9
10
11
12
[
{
"title": "文章标题",
"created": "创建日期",
"updated": "更新日期",
"link": "https://example.com",
"rule": "feed",
"author": "作者",
"avatar": "头像地址",
"createdAt": "生成时间"
}
]

​ 由于前端代码没有及时适配,仍然直接访问 json.title,结果自然得到了 undefined


🔧 解决方案

​ 要修复这个问题,只需修改相关代码,确保在处理接口返回的数据时,正确访问数组中的元素。

在**themes/anzhiyu/source/js/anzhiyu/random_friends_post.js**中

大约在第 157 行附近,修改以下代码:

修改前:

1
2
3
4
5
6
7
8
fetch(fetchUrl)
.then(res => res.json())
.then(json => {
var title = json.title;
var link = json.link;
var author = json.author;
// 其他代码...
});

修改后:

1
2
3
4
5
6
7
8
fetch(fetchUrl)
.then(res => res.json())
.then(json => {
var title = json[0].title; // 获取数组中的第一个元素
var link = json[0].link;
var author = json[0].author;
// 其他代码...
});

​ 通过上述修改,前端代码能够正确处理接口返回的数组格式数据,能正确读取到数组中第一个文章对象的 titlelinkauthor 等字段,重新显示随机文章的作者,标题和链接等内容,避免了 undefined 错误的发生。


📝 总结与建议

​ 这次的问题,本质上是 没有关注文档更新变化。Hexo-Circle-of-Friends 在新版本中调整了接口返回方式,由对象变为数组,前端若依旧按旧逻辑处理,自然会遇到 undefined 的情况。如果您在实施过程中遇到其他问题,建议查阅官方文档或寻求社区支持。