GitHubかんたん編集ツールで使ったOpenID認証に対応するサーバーコードを整理しました。 Denoを使って簡単にログイン付きサービスが作れます。jigインターンでおなじみお気軽サーバーフレームワーク Server.js の拡張です。

GitHubログイン実験」(テンポラリなサービスなのでそのうち落とすか別の用途に使います)
GitHubアカウントを持っている人向けです。src on GitHub

0. ドメインとDenoを起動できるサーバーを準備しましょう

1. GitHubのDeveloper applicationsから、"New OAuth App"
2. コールバックURLに "ドメイン + /openid_callback" を登録します
3. client_id を server.jsのclient_idと、static/index.htmlのログインURLのものを上書き
4. client_secret を生成して、client_secret.txt ファイルを作って保存
5. ドメインを設定したDenoがインストールされたサーバーで run.sh を起動
6. そのドメインにブラウザでアクセス


こんな画面が出るはずです。
7. GitHubでログイン


8. 設定したアプリへのログイン許可


9. accessTokenがlocalStorageに設定され、それを使ってログインユーザー情報をテスト表示!できました!


GitHubの Authorized OAuth Apps からアプリを選んで、revoke access すると・・・


accessTokenが無効になり、表示できなくなりました。

GitHub連携サービス、いろいろ作りましょう!

町内会でのGitHub、地域の危険箇所データを記録するCSVファイルの編集を改善!

CSV editor for GitHub
GitHubでログインを押すと、国高地区2021年版の地域安全データ「kidssafe2021.csv」が表示されます。 編集権限があれば、編集して「Commit changes」を押すと、元リポジトリに反映されます。

今の状態だと同時に編集した場合競合してしまうので、1レコードずつ追加や編集できるモードがあると更に使い勝手上がりそう。

GitHubのAPI、OpenIDでaccessTokenをゲットしたら、GitHub.jsを使って、ユーザー情報やリポジトリを取得したり、ファイルをプル&プッシュできます。 ファイルは、バイナリデータをBase64.jsでエンコード、デコードしてサーバーとやり取りします。

ユーザー登録やログイン機能の実装が不要なのは楽ですね。 OpenID認証機能付きのサーバーコードも使い方ドキュメント含めて整理して公開します。

Tweet
クリエイティブ・コモンズ・ライセンス
この作品は「Creative Commons — CC BY 4.0」の下に提供されています。
CC BY / @taisukef / アイコン画像 / プロフィール画像 / RSS