GraphQL：初学者指南

# Web 开发# 初学者# 教程

GraphQL 是一种功能强大且灵活的查询语言，旨在让应用更轻松地从服务器获取数据。如果您曾经使用过一款应用，并想知道它如何获取显示所需的所有信息，答案通常是 API（应用程序编程接口）。GraphQL 是一种设计这些 API 的现代方式。

在本指南中，我们将通过简单的解释和伪代码逐步探索 GraphQL，以便您能够像刚开始编写代码一样理解它。

什么是 GraphQL？

想象一下，你去一家餐厅，想要披萨、意大利面和饮料。通常，你必须分别订购（就像传统的 API 一样）。但如果服务员能准确理解你想要什么并一次性把所有东西端上来会怎么样？这就是 GraphQL！

GraphQL 让您可以在一次请求中请求**准确**您需要的数据，不多也不少。

GraphQL 如何工作？

GraphQL 围绕三个关键思想：

  • 模式：系统中所有可用数据的蓝图。
  • 查询：获取特定数据的请求。
  • 解析器：当您请求数据时获取数据的逻辑。

    • 让我们详细分析一下。

    示例场景：图书馆系统

    想象一个图书馆，我们需要有关书籍、作者和读者的信息。

    1. 架构

    模式定义了数据的“形状”。可以将其想象成餐厅的菜单。

    伪代码：

    type Book {
  title: String
  author: Author
  publishedYear: Int
}

type Author {
  name: String
  age: Int
  books: [Book]
}

type Query {
  getBook(title: String): Book
  getAllBooks: [Book]
  getAuthor(name: String): Author
}
  • 书籍：代表具有标题、作者和出版年份的书籍。
  • 作者：代表作者的姓名、年龄和所著书籍的列表。
  • 查询：列出您可以询问的有关图书馆数据的问题（查询）。

    • 2. 编写查询

    查询就像问问题。使用 GraphQL，你可以只请求所需的数据。

    伪代码：

    # Example Query: Get details of a book
{
  getBook(title: "Harry Potter") {
    title
    author {
      name
    }
    publishedYear
  }
}

    预期结果：

    {
  "data": {
    "getBook": {
      "title": "Harry Potter",
      "author": {
        "name": "J.K. Rowling"
      },
      "publishedYear": 1997
    }
  }
}

    请注意，我们只要求“title”、“author.name”和“publishedYear”。这节省了时间和资源。

    3. 解析器

    解析器就像厨房里的厨师。当您点餐时，厨师会为您准备食物。同样，解析器会获取您请求的数据。

    伪代码：

    const resolvers = {
  Query: {
    getBook: (parent, args, context) => {
      // Example: Find the book with the given title
      return libraryData.books.find(book => book.title === args.title);
    },
    getAllBooks: () => {
      return libraryData.books;
    },
    getAuthor: (parent, args) => {
      return libraryData.authors.find(author => author.name === args.name);
    }
  }
};
  • 父级：来自前一个解析器的信息（如果有）。
  • args：查询中传递的参数（例如，标题：“哈利波特”）。
  • 上下文：共享数据，例如用户身份验证。

    • 为什么使用 GraphQL？

    以下是开发人员喜爱 GraphQL 的原因：

  • 高效数据获取：不会出现过度获取（获取过多数据）或数据获取不足（获取数据不足）的情况。
  • 单一端点：与具有多个 URL 的传统 API 不同，GraphQL 使用单一端点。
  • 实时数据：GraphQL 支持订阅，让您获得实时更新（如股票价格或体育比分）。

    • GraphQL 与 REST API 相比如何？

    整合所有内容：图书馆应用程序示例

    在我们的图书馆应用中，完整的查询可能如下所示：

    **询问：**

    {
  getAuthor(name: "J.K. Rowling") {
    name
    books {
      title
      publishedYear
    }
  }
}

    **结果：**

    {
  "data": {
    "getAuthor": {
      "name": "J.K. Rowling",
      "books": [
        { "title": "Harry Potter", "publishedYear": 1997 },
        { "title": "Fantastic Beasts", "publishedYear": 2001 }
      ]
    }
  }
}

    要记住的关键术语

  • 模式：数据的结构。
  • 查询：对数据的请求。
  • 变异：改变（创建、更新、删除）数据的请求。
  • 解析器：获取或修改数据的代码。
  • 订阅：获取实时更新。

    • 结论

    GraphQL 就像一个可自定义的数据服务员。它简化了应用程序获取、更新和管理数据的方式，让开发人员和用户的工作更加轻松。凭借清晰的架构、灵活的查询和高效的解析器，它是现代应用程序开发的绝佳工具。

    无论您是在构建下一个 Instagram 还是简单的图书馆应用程序，了解 GraphQL 都会为您带来成功！