github 自定义主页,使用waka-readme-stats统计代码时长,并配置动态更新

前言

简要步骤

  1. 获取密钥:登录 wakatime ,获取 Secret API Key 密钥
  2. 配置IDE:下载 wakatime 编辑器插件,并配置 Secret API Key 密钥,wakatime 的统计数据来源于编辑器
  3. 配置仓库密钥:github上 配置 Secret API Key 密钥,授权 github 访问 wakatime 的统计数据
  4. 配置Github Action工作流:自动定时更新 README.md 上的统计数据
  5. 配置README.md:设置数据统计占位符
  6. 手动执行Github Action工作流:工作流是根据.yml配置文件定时执行的,如果想马上执行一次工作流,就需要自己手动执行一次

特别提醒:第一次配置时,编辑器同步到wakatime需要几个小时,wakatime同步到github需要一天,所以,只要流程没有报错,配置之后提示没有数据(No activity tracked)是正常的,耐心等待就可以了。

欢迎访问我的github自定义主页:https://github.com/xlz122

另外请参考:github 自定义主页,使用waka-readme配合wakapi统计代码时长,并配置动态更新

1.获取密钥

登录 WakaTime 官网,建议直接使用 GitHub 授权登录

进入 settings / account 页面,Secret API Key 就是密钥,点击一下就会显示

在这里插入图片描述

2.配置IDE

本文以vscode为例,其他编辑器参考这里 IDE插件安装教程

安装 wakatime 插件

在这里插入图片描述

配置 Secret API Key 密钥

使用快捷键 ctrl + shift + p, 接着输入 WakaTime: Api Key,回车

在这里插入图片描述

输入Secret API Key 密钥,回车

在这里插入图片描述

可以直接点击底部的这个图标或直接访问 WakaTime 进入 wakatime 统计页面

在这里插入图片描述

到此为止,本地的开发环境就已经被 WakaTime 监控了,数据会被传输到 WakaTime 然后在 dashboard 中展示

第一次配置,编辑器更改代码后,数据同步需要等待几个小时,请耐心等待

在这里插入图片描述

当数据同步好之后,就可以查看数据统计页面了

在这里插入图片描述

3.配置仓库密钥

Github 自定义首页的仓库,打开 Settings / Secrets / Actions 页面,点击 New repository secret

在这里插入图片描述

添加 Secret API Key 密钥

Name 为 WAKATIME_API_KEY ,value 为Secret API Key 密钥

在这里插入图片描述

保存后显示如下

在这里插入图片描述

获取 GitHub API 令牌, 打开 Settings / Developer settings / Personal access tokens 页面,点击 Generate new token

在这里插入图片描述

note 是 GitHub API 令牌备注
Expiration 是 GitHub API 令牌过期时间

权限部分勾选 repo 和 user

最后点击 Generate token 生成令牌

在这里插入图片描述

在这里插入图片描述

点击复制 GitHub API 令牌

在这里插入图片描述

打开自定义仓库的 Settings / Secrets / Actions 页面,点击 New repository secret ,添加 GitHub API 令牌

Name 为 GH_TOKEN ,value 为 GitHub API 令牌

在这里插入图片描述

到这里仓库所需密钥就配置完成了

在这里插入图片描述

4.配置Github Action工作流

打开自定义首页仓库的 Actions 页面,点击 set up a workflow yourself 设置工作流

在这里插入图片描述

文件名随意,清空初始内容,添入如下配置

配置项:

  • cron 定时执行工作流时间
  • uses 使用的 github 库地址

一些自定义配置可以在 waka-readme-stats 仓库中找到示例

name: Waka Readme

on:
  schedule:
    # Runs at 12am IST
    - cron: '30 18 * * *'
  workflow_dispatch:
jobs:
  update-readme:
    name: Update Readme with Metrics
    runs-on: ubuntu-latest
    steps:
      - uses: anmol098/waka-readme-stats@master
        with:
          WAKATIME_API_KEY: ${{ secrets.WAKATIME_API_KEY }}
          GH_TOKEN: ${{ secrets.GH_TOKEN }}
          # 时间线
          SHOW_LOC_CHART: False

在这里插入图片描述

提交至仓库

在这里插入图片描述

5.更新README.md

添加如下代码,相当于一个占位符,数据统计放置在哪个位置

<!--START_SECTION:waka-->
<!--END_SECTION:waka-->

6.手动运行 Github Actions 工作流

github actions 工作流是根据 .yml 配置文件定时运行任务,如果想马上看到结果,就需要手动执行一下

打开自定义首页仓库的 Actions 页面,点击 Waka Readme ,再点击 Run workflow

在这里插入图片描述

执行之后,可以点击任务进入详情查看执行日志

在这里插入图片描述

执行完毕

在这里插入图片描述

如果出现如下,耐心等待一天,等待数据同步

详见这个issues: BUG The waka data is not updating

The data seems to be empty, please wait for a day

在这里插入图片描述

7.查看效果

默认是有很多图表的,其余图表被我配置不显示了。

在这里插入图片描述

遇到问题:

  1. 运行工作流,WAKA time API returned 401 Response,考虑 github 令牌权限问题,重新创建 github 令牌,并且 note 字段也重命名一下,这个问题得以解决。
  2. 运行工作流,KeyError: ‘languages’,相关issues可以查看 BUG Exception Occurred ‘languages’ ,百度和谷歌都没有找到相关的解决方案,我是直接把仓库删了重新创建,密钥以及工作流全部重新弄,这个问题得以解决。

如果本篇文章对你有帮助的话,很高兴能够帮助上你。

当然,如果你觉得文章有什么让你觉得不合理、或者有更简单的实现方法又或者有理解不来的地方,希望你在看到之后能够在评论里指出来,我会在看到之后尽快的回复你。

  • 22
    点赞
  • 23
    收藏
    觉得还不错? 一键收藏
  • 6
    评论
评论 6
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值