我想在我的GitHub个人资料README中添加我的Stack Overflow声望作为实时徽章。
首先，我需要使用一些API从Stack Overflow获取我的帐户信息。接下来，我需要提取声望，并将其传递给另一个API，该API会创建Markdown格式的徽章。
现在，我已经进行了一些研究，似乎可以使用Stack Exchange API通过端点URL以JSON格式获取我的Stack Overflow账户信息。此外，Shield.io的API将允许我从端点URL创建徽章，这非常完美。但是，Shields.io要求端点符合特定的JSON格式。
因此，为了解决这个难题，我需要第三个API，该API能够读取和解析来自Stack Exchange API的JSON数据，然后以所需的JSON格式托管端点URL。 RunKit的API似乎能够胜任这项工作。
以下是我的目标示例（但不是提交次数，而是我的Stack Overflow声誉）：
要将StackOverflow声誉作为实时徽章获得，只需用自己的用户ID和姓名替换我的即可！
<a href="https://stackoverflow.com/users/10249156/wasitshafi" target="_blank">
<img alt="StackOverflow"
src="https://stackoverflow-badge.vercel.app/?userID=10249156" />
</a>
结果
首先使用 Stack Exchange 的 用户 API 这里，您可以通过一个端点 URL 以 JSON 格式获取您的 Stack Overflow 帐户信息。您只需在 ID 字段中指定您的 Stack Overflow 用户ID并单击 运行 按钮即可生成端点路径。您可以通过点击个人资料图片来获取您的 Stack Overflow 用户ID，它将出现在搜索栏中。
将生成的路径添加到 https://api.stackexchange.com 中，以形成端点 URL。
我的 Stack Exchange 端点 URL: https://api.stackexchange.com/2.2/users/9133459?order=desc&sort=reputation&site=stackoverflow
现在我们已经获得了以 JSON 格式呈现的 Stack Overflow 信息，我们可以继续解析它并创建满足 Shields 要求的新端点。为此，您需要在 RunKit 上创建一个帐户。在 RunKit 上发布此段代码，并确保 Node 版本为 v4.9.1（用先前生成的自己的端点 URL 替换代码中的 URL）：
// variables
var endpoint = require("@runkit/runkit/json-endpoint/1.0.0");
var fetch = require("node-fetch");
var url = "https://api.stackexchange.com/2.2/users/9133459?order=desc&sort=reputation&site=stackoverflow";
let settings = { method: "Get" };
// main function
endpoint(module.exports, async function()
{
try {
await fetch(url, settings)
.then(res => res.json())
.then((json) => {
reputation = json["items"][0].reputation;
if (reputation >= 1000) {
reputation = reputation / 1000;
reputation = Math.floor(reputation * 10) / 10;
// if first decimal place is 0
if ((reputation * 10) % 10 == 0) {
// round to int
reputation = Math.round(reputation);
}
reputation = reputation.toString();
reputation += "K";
}
});
} catch(e) {
return {
"schemaVersion": 1,
"label": "STACKOVERFLOW REPUTATION",
"message": "API ERROR",
"color": "FF0000",
"labelColor": "black",
"style": "for-the-badge"
}
}
return {
"schemaVersion": 1,
"label": "STACKOVERFLOW REPUTATION",
"message": reputation,
"color": "FE7A16",
"labelColor": "black",
"style": "for-the-badge"
}
})
发布后，点击 RunKit 页面顶部的端点超链接，以查看要传递给 shields 以创建徽章的端点 URL。
这是我的 RunKit 端点 URL：https://stack-overflow-reputation-ciqil1ej93hq.runkit.sh
现在，只需前往 shields.io 的 JSON 端点徽章页面此处并将 URL 粘贴如下：
除了复制徽章 URL 的选项外，您还可以选择复制 markdown 版本，将其复制并粘贴到 GitHub 个人资料页的 README 中。
Markdown 输出结果：
注意：您可以通过更改 RunKit 代码中的 JSON 返回语句或覆盖要更改的 JSON 端点徽章页面中的内容来更改徽章的设计。可以更改的属性列在同一页上。
这个方法不再有效... 其他解决方案， 首先使用 stack exchange 的用户 API 此处，你只需在 id 字段中指定你的 Stack Overflow 用户 id 并单击运行以生成终端路径。你可以通过点击个人资料图片来获得你的 Stack Overflow 用户 id，它会显示在搜索栏中。
现在，前往 shields.io 的聊天徽章 此处 并将你的链接粘贴到查询部分
在查询部分，你只需要粘贴 /users/ 后面的部分，例如：
这是完整的 URL:
/2.2/users/2096394?order=desc&sort=reputation&site=stackoverflow
你只需要这部分:
2096394?order=desc&sort=reputation&site=stackoverflow
这样你就可以使你的徽章正常工作。
对我来说，Shields.io的StackExchange声望终端工作正常。以下是一个例子:
有时会出现故障。可能的原因。（已修复）
<!-- hyperlinked with alt text and title: -->
[](https://stackoverflow.com/users/<user_id> "<user_name>'s Stack Overflow Reputation")
在上面的代码中，将<user_id>替换为你的StackOverflow用户ID，可以使用profile访问您的个人资料并检查个人资料URL来获取它。 URL的格式为：https://stackoverflow.com/users/<user_id>/<user_name>，<user_name>部分可以替换成你想要的任何内容。
TEMPLATE.md中使用以下markdown：<a href="https://stackoverflow.com/users/{{ plugins.stackoverflow.user.id }}">
<img src="https://img.shields.io/badge/Reputation-{{ plugins.stackoverflow.user.reputation }}-F47F24?logo=stackoverflow&style=flat-square" alt="StackOverflow">
</a>
name: Metrics
on:
# Schedule updates (once per day)
schedule: [{cron: "0 1 * * *"}]
# Lines below let you run workflow manually and on each commit (optional)
workflow_dispatch:
push: {branches: ["master", "main"]}
jobs:
readme-template:
name: Generate README
runs-on: ubuntu-latest
steps:
- name: Update README.md
uses: lowlighter/metrics@main
with:
# Common config
user: jayvdb
token: ${{ secrets.METRICS_TOKEN }}
output_action: skip-if-only-metadata-changed
committer_branch: main
committer_message: Update ${filename} - [GitHub Action]
config_timezone: Etc/UTC
# Input file
markdown: https://raw.githubusercontent.com/jayvdb/jayvdb/main/TEMPLATE.md
# Output file
template: markdown
filename: README.md
config_output: markdown
plugin_stackoverflow: yes
plugin_stackoverflow_user: 5037965
plugin_stackoverflow_sections: answers-top, answers-recent
plugin_stackoverflow_limit: 3
plugin_stackoverflow_lines: 0
@Chris的解决方案似乎是目前唯一可行的。因此，如果你从StackOverflow Flair部分获取的Flair看起来不太好，你可以按照以下方式手动设置声望：
<!-- Add your profile URL below-->
<a href="https://stackoverflow.com/users/10883380/visal-rajapakse">
<img src="https://img.shields.io/badge/Stack%20Overflow-802-F47F24">
<!-- ^ Change this to your reputation -->
</a>
The above will look like:
这里有一个https://shields.io/的链接。
不幸的是，它无法工作。
所以我fork并克隆了shield存储库。当我在本地运行时，它可以工作。 这意味着StackOverflow API可能有配额或将shield IO的IP地址列入黑名单。
您可以fork此项目并自己托管（可以使用类似Heroku的东西）。