GraphiQLを使ってGitHubのGraphQL APIをさわってみた

CX事業本部、大阪オフィスの小倉です。

私が所属している開発チームでは、毎週水曜日にふりかえりを実施しています。
ただ、最近は1週間前の出来事ですら忘れてしまっていて、振り返りのタイミングで「今週何してたっけ？」となることがありました。
幸い、プロジェクトに関する活動はほぼGitHub上で行われている為、今回API経由で一週間の活動内容を取得してみることにしました。
目標は自分が作成又はレビューしたPull Requestの取得です。
GitHubのAPIはREST APIもありますが、今回はGitHub GraphQL API v4を使ってみます。

GraphQL API Explorer

残念ながら現時点で、私はGraphQL何も分からないマンなので、ツールに頼ります。
GitHubには、GraphQL API Explorerというページがあり、
ここでGraphQL APIを記述して試すことが出来ます。 これはブラウザ上で動作するGraphQL IDEのGraphiQLで作られているようです。

左側には記述可能なType,Filedや引数等を教えてくれるドキュメントが表示できます。
右側のExplorerは、記述できる要素を階層構造で表示してくれ、クリックするとエディタに自動で入力してくれます。
中央のエディタは、入力補完をやってくれます。

これなら初心者の私でも出来そう！と思い、以下のクエリを作ってみました。

query MyQuery {
  viewer { # ログイン中のユーザに関する情報
    contributionsCollection(from: "2019-12-11T04:00:00Z") { #先週水曜の午後以降の情報を取得
      pullRequestContributionsByRepository { #リポジトリ毎のPull Request情報
        repository {
          name
        }
        contributions(last: 100) {
          totalCount
          nodes {
            pullRequest {
              title # Pull Requestのタイトル
              number# Pull Requestについている番号(#1等)
              createdAt
              author {
                login
              }
              merged
            }
          }
        }
      }
      pullRequestReviewContributionsByRepository { #リポジトリ毎のPull Requestレビュー情報
        repository {
          name
        }
        contributions(last: 100) {
          totalCount
          nodes {
            pullRequestReview {
              pullRequest {
                title
                number
              }
              author {
                login
              }
              submittedAt
            }
          }
        }
      }
    }
  }
}

ところが、実行しても目的の情報が出てきません。
どうやらGraphQL API Explorerでは、プライベートリポジトリの情報にアクセスできないようでした。

https://developer.github.com/v4/guides/forming-calls/#authenticating-with-graphql

To match the behavior of the GraphQL Explorer, request the following scopes:

user
public_repo
repo
repo_deployment
repo:status
read:repo_hook
read:org
read:public_key
read:gpg_key

GraphiQL app

プライベートリポジトリの情報にアクセスしたいので、自分でアクセストークンを作成し、デスクトップアプリであるGraphiQL appから実行してみます。

手順はhttps://developer.github.com/v4/guides/using-the-explorer/を見ながら進めます。

1. アクセストークンの作成
   • GitHub > Settings > Developer settings > Personal access tokens から作成
   • プライベートリポジトリへのアクセスには、[ ]repo Full control of private repositoriesをチェックする
2. アプリを起動し、Edit HTTP Headersを開く
3. キーにAuthorization、値にBearer <作成したトークン>を設定
4. 元の画面に戻り、GraphQL Endpointにhttps://api.github.com/graphqlを入力

これで先程のクエリを実行してみると、無事以下のような結果が出力されました。

ということで、無事目的の情報を取得することができました。 ちなみに今週の私の活動は、
- Pull Request作成数：2
- Pull Requestレビュー数：20

となっていたので、レビューに注力していたことが分かりました。

まとめ

今回は全くGraphQLを触ったことがない状態から、ツールの助けを借りてGitHub上の情報を取得することができました。
GitHubを普段使われている方であれば、ユーザ、リポジトリ、プルリクエスト等データの構造をイメージしやすい為、
今回紹介したツールと組み合わせてGraphQLに触れてみるのに丁度良い題材かなと感じました。

この記事がGraphQLに触れるきっかけになれば幸いです。
以上、大阪オフィスの小倉でした。