페이지 스타일을 고려한 질의를 GiitHub APIv4에 설치

GiitHub APIv4에서 페이지의 하이픈을 고려하여 쿼리를 던질 기회가 있기 때문에 워크노트입니다.

GiitHub APIv4에 대한 페이지 설정

GiitHub APIv4에 nodes 또는 edges가 있는 리소스에는 객체 필드PageInfo가 있고 다음 4개의 필드가 있습니다.

endCursor

hasNextPage

hasPreviousPage

startCursor

호출 중에는 이것endCursor과 hasNextPage의 한 쌍 또는 startCursor와 hasPreviousPage의 한 쌍을 사용하세요.
endCursor는 nodes의 마지막 노드의 커서 (base 64로 인코딩된 문자열 포함) 입니다.hasNextPage는 다음 페이지의 boolean이 있는지 여부입니다.
nodes의 조회는 cursor:xxx,after,before,first의 호출용 파라미터가 있다.
first,last는 필수 매개 변수입니다.시작 위치에서 얼마나 많은 건수를 얻었는지 지정한다.애프터, 비포어는 시작 위치를 결정하는 물건이다.방금 PageInfo에서 얻은 endCursor와 startCursor의 값을 지정하여 붙여넣을 수 있습니다.
https://docs.github.com/en/graphql/reference/queries

인스턴스

소유자의 모든 창고를 검색하지 않았습니다.js로 써 봤어요.

import fetch from 'node-fetch'

type Repository = {
  name: string;
  url: string;
};

type APIResponse = {
  data: {
    repositoryOwner: {
      repositories: {
        pageInfo: {
          endCursor: string,
          hasNextPage: boolean
        }
        nodes: Repository[]
      }
    }
  }
};

const GITHUB_ACCESS_TOKEN = process.env.GITHUB_ACCESS_TOKEN
const OWNER = 'kawamataryo'

const fetchRepositories = async  (endCursor?: string): Promise<APIResponse> => {
  const res = await fetch("https://api.github.com/graphql", {
    method: "post" as const,
    headers: {
      Authorization: `Bearer ${GITHUB_ACCESS_TOKEN}`,
    },
    body: JSON.stringify({query: `
      query {
        repositoryOwner(login: ${OWNER}) {
          repositories (
            first: 30
            ${endCursor ? `after: "${endCursor}"` : ''}
          ) {
            pageInfo {
              hasNextPage
              endCursor
            }
            nodes {
              name
              url
            }
          }
        }
      }
    `}),
  });
  return await res.json() as APIResponse
}

export const getAllRepositories = async (previousValue: Repository[], endCursor?: string): Promise<never | Repository[]> => {
  const res = await fetchRepositories(endCursor)
  const pageInfo = res.data.repositoryOwner.repositories.pageInfo
  const repositories = [...previousValue, ...res.data.repositoryOwner.repositories.nodes]

  // 再帰の終了条件
  if (!pageInfo.hasNextPage) {
    return  repositories
  }

  return getAllRepositories(repositories, pageInfo.endCursor)
}

점은GraphiQL 요청last을 할 때endCursor를 받아들여 조회장에 after에 서로 다른 값을 설정합니다.fetchRepositories에서 페이지인포에서 endCursor를 가져와서 매번 다른endCursor로fetchRepositories를 실행합니다.getAllRepositories는 귀속 집행이기 때문에 종료 조건hasNextPage가 가짜일 때 모든 창고 정보를 얻을 수 있습니다.