首先

我最近有机会编写一个使用Node.js和GraphQL的程序，但在调研从服务器端而不是前端使用的方法时花了一些时间，所以我将其写成了一篇文章。

AppoloClient是什么意思？

这是一个用于与GraphQL服务器通信的库。由于本文主要关注执行GraphQL查询的简易性，因此不会详细介绍，但是这个功能强大的库可以自动处理通信状态（如加载和错误），并将获取的结果作为缓存保存。

实践起来！

让我们实际从Node.js的代码中执行GraphQL。

预先准备

※假设已安装Node.js。
以下步骤将使用GitHub GraphQL API进行示例操作确认。
（使用GraphQL获取GitHub存储库和问题的信息的API）
由于需要使用一个令牌，因此请事先在以下页面上点击“生成新令牌”按钮以生成令牌。
https://github.com/settings/tokens/

请确保在运行源代码之前使用以下命令预先安装所需的库。

yarn add node-fetch graphql @apollo/client 

源代码

请将固定的”token”设置内容替换为事先准备好的令牌。

"use strict";

global.fetch = require("node-fetch");
const { ApolloClient, InMemoryCache, gql } = require("@apollo/client/core");
const token = "XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX";

// 自分のリポジトリを取得するクエリ
const searchQuery = gql`
  query repositories($number_of_repos: Int!) {
    viewer {
      repositories(last: $number_of_repos) {
        nodes {
          name
        }
      }
    }
  }
`;

// https://github.com/octocat/Hello-World/issues/349　のイシューにリアクションを付けるクエリ
const mutationQuery = gql`
  mutation AddReactionToIssue {
    addReaction(
      input: { subjectId: "MDU6SXNzdWUyMzEzOTE1NTE=", content: HOORAY }
    ) {
      reaction {
        content
      }
      subject {
        id
      }
    }
  }
`;

// GraphQL クライアントを生成
const apolloClient = new ApolloClient({
  uri: "https://api.github.com/graphql",
  headers: { authorization: `Bearer ${token}` },
  cache: new InMemoryCache(),
});

// searchQueryを実行する関数
async function search() {
  const searchResult = await apolloClient
    .query({ query: searchQuery, variables: { number_of_repos: 3 } }) //取得するリポジトリの数を設定
    .then((result) => {
      return result;
    })
    .catch((error) => {
      console.log(error);
    });
  console.log(JSON.stringify(searchResult, undefined, 2));
}

// mutationQueryを実行する関数
async function mutation() {
  const mutationResult = await apolloClient
    .mutate({ mutation: mutationQuery })
    .then((result) => {
      return result;
    })
    .catch((error) => {
      console.log(error);
    });
  console.log(JSON.stringify(mutationResult, undefined, 2));
}

search();
mutation();

实际执行结果摘要

{
  "data": {
    "viewer": {
      "__typename": "User",
      "repositories": {
        "__typename": "RepositoryConnection",
        "nodes": [
          {
            "__typename": "Repository",
            "name": "Repository1"
          },
          {
            "__typename": "Repository",
            "name": "Repository2"
          },
          {
            "__typename": "Repository",
            "name": "Repository3"
          }
        ]
      }
    }
  }
}
{
  "data": {
    "addReaction": {
      "reaction": {
        "content": "HOORAY",
        "__typename": "Reaction"
      },
      "subject": {
        "id": "MDU6SXNzdWUyMzEzOTE1NTE=",
        "__typename": "Issue"
      },
      "__typename": "AddReactionPayload"
    }
  }
}

以下是数据的中文释义：

第一数据是由查询获取的仓库信息。
第二数据是使用变更操作对问题的反应结果。
在执行源代码后，您可以验证问题中是否已经添加了您的帐户的反应。
请注意，这是由GitHub官方创建的用于测试反应的问题。
链接：https://github.com/octocat/Hello-World/issues/349

如果您因为不想将秘密密钥放在前端等原因，希望从服务器端执行GraphQL查询，请务必参考以上内容。