关于 Beaudar 的 Q&A

李鹏坤 / 2020-06-08


Q:无法从 GitHub 获取数据

api.github.com 部分 CDN 服务器被墙,导致请求失败。 解决思路,PC 端 host 重定向,移动端搭梯子。这里只提供 host 重定向的解决步骤。


Q:token 请求失败

这个问题一般来说,如果网络连接没有问题,点击一下“刷新”按钮就可解决,因为 Beaudar 使用的是 Cloudflare 的网络。 在中国境内,部分地区会有网络不稳定的情况。


Q:缺少 “beaudar.json” 配置 或 不允许 xxx 发布到 xxx/xxx

这是因为 Beaudar 在评论输入到发表评论期间,会异步查询评论仓库的根目录是否存在 beaudar.json,并校验评论来源站点是否在文件中存在。 如果不存在,Beaudar 将不会在目标仓库建立评论 issue。可参考 Beaudar 代码仓库beaudar.json 的配置。多个 origins 来源,在数组 [] 中填写,以 , 分隔。


Q:与 Utterances 比较,Beaudar 增加了什么


Q:如何在引用的页面修改 Beaudar 的主题

因为 Beaudar 出于安全考虑使用了 iframe 来进行隔离,通过 JS 是无法跨域修改的。可以使用 postMessage 来进行跨域通信。

例子如下:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
/**
 * @theme 可选:
 * [
 *   'icy-dark',
 *   'dark-blue',
 *   'photon-dark',
 *   'github-dark',
 *   'github-light',
 *   'github-dark-orange',
 *   'preferred-color-scheme'
 *   ……
 * ]
 */
const message = {
  type: 'set-theme',
  theme: 'github-light'
};

const beaudarIframe = document.querySelector('iframe');
// 与 beaudar 通信
beaudarIframe.contentWindow.postMessage(message, 'https://beaudar.lipk.org');

Q:评论显示的分页逻辑

固定每页 10 条数据。

进入页面
│
└─ 加载第一页 + 加载最后一页
                    └─ 最后一页少于 3 条数据,加载倒数第二页

由于 issue 获取的 API 不能设置倒序和顺序(默认:顺序),所以“倒序显示”是由前端处理的。

顺序显示:

<旧评论> 总数 : 10

<加载更多……>

<新评论> 总数 : 3 ~ 12

倒序显示:

<新评论> 总数 : 3 ~ 12

<加载更多……>

<旧评论> 总数 : 10