こんにちは，ぽち@pchwです．
Annict にはGraphQLのAPIがあり，色んなアニメの情報を取得することが出来ます．
Animiteru ではAnnictと連携して特定ユーザの今期視聴アニメ一覧を画像1枚にする機能やトップページの今期アニメ一覧でAnnictのGraphQL APIを叩いています．
Animiteru のバックエンド処理はAWS Lambdaで行っているので，Node.jsを使ってGraphQL APIを叩きます．
npmモジュールでApollo Clientという便利なライブラリがあり，それを使うと簡単に扱うことができます．
今回は，OAuthによる認証は不要な造りだったので，ここから個人用アクセストークンを発行して使います．（発行にはログインが必要です）
まずは，ApolloClientとnodeのfetch実装であるnode-fetchをインストールします．
$ npm install --save graphql apollo-client-preset node-fetch
const { ApolloClient } = require('apollo-client');
const client = new ApolloClient()
と出来れば良いのですが，色々と設定があります．
まず，AnnictのGraphQL APIのエンドポイントの指定と，Authorizationの設定が必要です．
それには，apollo-link-httpとapollo-link-contextを使ってlinkプロパティの設定と，cacheプロパティの設定が必要です．
cacheプロパティはapollo-cache-inmemoryを使ってインメモリキャッシュを指定することにします．
また，apollo-link-httpがfetchを要求するので，node-fetchを与えます（フロントエンドでApolloClientを使うこともできますが，その時はIEなどを対応する場合は同様にfetch pollyfilを入れる必要があります）
$ npm install --save apollo-link-context
const fetch = require('node-fetch');
const { ApolloClient } = require('apollo-client');
const { createHttpLink } = require('apollo-link-http');
const { setContext } = require('apollo-link-context');
const { InMemoryCache } = require('apollo-cache-inmemory');
const client = new ApolloClient({
link: setContext((_x, { headers }) => {
return {
headers: Object.assign({}, headers, {
authorization: `Bearer ${conf.annict.accessToken}`
})
};
}).concat(
createHttpLink({
uri: 'https://api.annict.com/graphql',
fetch: fetch
})
),
cache: new InMemoryCache()
});
このような形になります．得られたclientを使ってGraphQL APIに対してGQLを投げて結果を受け取ります．
GQLを使うには，graphql-tagを使います．
$ npm install --save graphql-tag
あとは，client.queryにqueryを持つオブジェクトを渡してAPIを叩きます．
require('co')(function*(){
const gql = require('graphql-tag');
const result = yield client.query({
query: gql`
query {
searchWorks(annictIds: [5407], orderBy: { field: WATCHERS_COUNT, direction: DESC }) {
edges {
node {
annictId
title
titleEn
}
}
}
}
`
});
});
GQLの記述や確認は，
を使うと楽ちんです．
春アニメもはじまったことなので，AnnictのGraphQL APIを使って遊んでみるのもいいんじゃないでしょうか？
うちはダリフラが好きです（前期からの継続）
