GitHubのプロフィールにREADMEでアクセスカウンタを表示する

ちょっと前からGitHubのプロフィールにREADMEを表示できるようになったようです（2020/7/20現在）。僕も試してみてアクセスカウンタを表示してみました。

https://github.com/dala00

キリ番報告用の掲示板（issue）もあります。キリ番ゲットしたら絶対にスルーしてはいけません。

READMEの表示方法

プロフィールに表示するREADMEは、自分のユーザーIDと同じ名前のリポジトリを作ることで、そこに作ったREADMEを表示することが出来ます。作成しようとすると下記のような表示が現れます。

赤くなっているのは僕が既に作成済みだからなので無関係です。あとはもしかしたらリリースされたばかりの機能のため、人によってはまだでないのかもしれません。

これでリポジトリを作成したら、README.mdを作成すればプロフィールにそれが表示されます。

アクセスカウンタを表示する

dev.toとかを見ると、色んな人が色々なREADMEを作って遊んでいます。僕も作成時の参考にしたのですが、 @ryanlanciaux さんのプロフィールは昔懐かしきWebを表現しています。

この方のアクセスカウンターは、実はパラメータを変えれば誰でも使うことができるというシロモノです。とにかくすぐ試してみたい場合はこれを利用してみると良いでしょう。

Add a visitor count on your GitHub profile with one line of Markdown - DEV Community

ただし下記の技術記事を見る限りはオンメモリで値を持っているようですので、何か再起動のタイミングとかがあれば0に戻ってしまう可能性はあるのかもしれません。もしくはデータ保存型に修正済みかもしれませんが。

Quick GitHub profile visit counter - DEV Community

アクセスカウンタを作る

自分で作る場合です。具体的には下記の方法です。

• 値は適当に保存したり取得したりさせる
• 動的に画像もしくはSVGを作る
• キャッシュを無効にする

基本的には難しいことはしていません。キャッシュを無効にしないと、GitHub側で画像をキャッシュしてしまうため、キャッシュ無効のレスポンスヘッダを返して無効にします。そうすれば大丈夫みたいです。よくよく考えたらCIのバッジもキャッシュされず動的に変わってますね。元々不可能ではなさそうです。

僕のプロフィールのリポジトリに一応サンプルのプログラムも置いてあります。適当です。

https://github.com/dala00/dala00/blob/master/counter_sample.php

キャッシュでハマったのでなんやかんややっているうちにSVGになってしまいましたが、多分普通に画像でも行けるのではないかと思います……が試していないため分かりません。

あとは先程の方がやっていたように、別にサーバーを持たなくてもGlitchで行けるのではないかと思いますがこちらも面倒で試していません（作り終わってからそっちでやればよかったと気づきました）

ということで皆さんも色々試してみて下さい。

できないこと

多分iframe表示したりはざっと調べた限り、出来ないんじゃないかと思いますが試していません。画像で試行錯誤するしかないのかな……と今のところ思っています。何か面白いことができたらぜひ教えて下さい。