什么是GraphQL,有什么特点

news2024/11/23 13:09:49

什么是GraphQL?

GraphQL 是一种用于 API(应用程序编程接口)的查询语言,由 Facebook 在 2012 年开发,并于 2015 年开源。它提供了一种更高效、强大的方式来获取和操作数据,与传统的 RESTful API 相比,GraphQL 具有更高的灵活性和更低的网络负载。通过 GraphQL,客户端可以精确地请求所需的数据,而服务器则只返回这些数据,从而避免了过度加载或不足加载的问题。

GraphQL 的核心概念
  1. 类型系统:GraphQL 使用强类型系统定义数据模型。每个字段都有明确的数据类型,如 StringIntBoolean 等,还可以定义复杂类型如对象类型、枚举类型、输入对象类型等。

  2. 查询:客户端可以通过发送一个查询语句来请求特定的数据。查询语句是一个树状结构,描述了需要获取的数据字段及其子字段。

  3. 变更(Mutations):用于执行写操作,如创建、更新或删除数据。变更操作也遵循严格的类型定义。

  4. 订阅(Subscriptions):允许客户端实时接收数据更新。订阅通常用于实现实时通信功能,如聊天应用中的消息推送。

  5. 字段解析器(Resolvers):服务器端的逻辑单元,负责处理查询中的每个字段。解析器可以根据请求参数从数据库或其他数据源中获取数据,并将其返回给客户端。

  6. 模式(Schema):定义了 API 的结构,包括可用的查询、变更和订阅,以及它们的参数和返回类型。模式是 GraphQL API 的核心部分,确保了客户端和服务器之间的契约。

GraphQL 的特点

  1. 精确的数据请求:客户端可以精确地指定需要的数据字段,避免了不必要的数据传输,提高了性能和响应速度。

  2. 单个端点:GraphQL API 通常只有一个端点,所有查询和变更都通过这个端点进行。这简化了客户端的实现,减少了 API 管理的复杂性。

  3. 强类型系统:通过定义明确的类型和字段,确保了数据的一致性和可靠性。客户端可以在编译时检查查询的有效性,减少运行时错误。

  4. 灵活的数据聚合:客户端可以请求多个资源的数据,并在一次请求中获得结果。这减少了网络往返次数,提高了用户体验。

  5. 版本控制:由于客户端可以精确地请求所需的数据,因此可以在不破坏现有客户端的情况下逐步演进 API。这使得版本控制变得更加灵活。

  6. 工具支持:GraphQL 生态系统提供了丰富的工具,如 GraphiQL、Apollo Studio 等,帮助开发者调试和优化 API。

GraphQL 的作用

  1. 提高开发效率:通过精确的数据请求和强类型系统,开发者可以更快地构建和测试 API,减少调试时间。

  2. 优化性能:客户端只需请求必要的数据,减少了网络负载和服务器压力,提高了整体性能。

  3. 增强用户体验:通过减少网络往返次数和提高数据加载速度,用户可以更快地获取所需信息,提升应用的响应性和流畅度。

  4. 简化后端架构:单个端点的设计减少了后端服务的数量和复杂性,使得维护和扩展更加容易。

  5. 支持实时数据:通过订阅机制,可以实现实时数据更新,适用于需要实时通信的应用场景。

示例说明

为了更好地理解 GraphQL 的工作原理和优势,我们通过一个具体的示例来说明。假设我们正在开发一个社交媒体应用,需要展示用户的个人信息和最近发布的帖子。

定义模式

首先,我们需要定义 GraphQL 模式,描述可用的查询、变更和订阅。以下是一个简单的模式定义:

type User {
  id: ID!
  name: String!
  email: String!
  posts: [Post!]!
}

type Post {
  id: ID!
  title: String!
  content: String!
  createdAt: String!
  author: User!
}

type Query {
  user(id: ID!): User
  posts(userId: ID!): [Post!]!
}

type Mutation {
  createUser(name: String!, email: String!): User
  createPost(title: String!, content: String!, userId: ID!): Post
}

type Subscription {
  newPost: Post
}
查询示例

假设我们想获取某个用户的详细信息及其最近发布的帖子,可以发送以下查询:

query GetUserWithPosts($userId: ID!) {
  user(id: $userId) {
    id
    name
    email
    posts {
      id
      title
      content
      createdAt
    }
  }
}

在这个查询中,我们使用了变量 $userId 来指定要查询的用户 ID。服务器将返回该用户的详细信息及其最近发布的帖子。

变更示例

假设我们要创建一个新的用户,可以发送以下变更请求:

mutation CreateUser($name: String!, $email: String!) {
  createUser(name: $name, email: $email) {
    id
    name
    email
  }
}

在这个变更请求中,我们传递了用户的姓名和电子邮件地址。服务器将创建新的用户并返回其详细信息。

订阅示例

假设我们要实现实时的新帖子通知,可以使用订阅机制:

subscription NewPost {
  newPost {
    id
    title
    content
    createdAt
    author {
      id
      name
    }
  }
}

当有新的帖子发布时,服务器会实时推送新帖子的信息到订阅的客户端。

实现细节

服务器端实现

在服务器端,我们需要实现字段解析器来处理查询和变更请求。以下是一个使用 Node.js 和 Express 实现的简单示例:

const express = require('express');
const { ApolloServer, gql } = require('apollo-server-express');

// 模拟数据存储
const users = [
  { id: '1', name: 'Alice', email: 'alice@example.com' },
  { id: '2', name: 'Bob', email: 'bob@example.com' }
];

const posts = [
  { id: '1', title: 'First Post', content: 'This is the first post.', createdAt: '2023-10-01T00:00:00Z', authorId: '1' },
  { id: '2', title: 'Second Post', content: 'This is the second post.', createdAt: '2023-10-02T00:00:00Z', authorId: '2' }
];

// 定义模式
const typeDefs = gql`
  type User {
    id: ID!
    name: String!
    email: String!
    posts: [Post!]!
  }

  type Post {
    id: ID!
    title: String!
    content: String!
    createdAt: String!
    author: User!
  }

  type Query {
    user(id: ID!): User
    posts(userId: ID!): [Post!]!
  }

  type Mutation {
    createUser(name: String!, email: String!): User
    createPost(title: String!, content: String!, userId: ID!): Post
  }

  type Subscription {
    newPost: Post
  }
`;

// 定义解析器
const resolvers = {
  Query: {
    user: (parent, { id }) => users.find(user => user.id === id),
    posts: (parent, { userId }) => posts.filter(post => post.authorId === userId)
  },
  Mutation: {
    createUser: (parent, { name, email }) => {
      const newUser = { id: users.length + 1, name, email };
      users.push(newUser);
      return newUser;
    },
    createPost: (parent, { title, content, userId }) => {
      const newPost = { id: posts.length + 1, title, content, createdAt: new Date().toISOString(), authorId: userId };
      posts.push(newPost);
      return newPost;
    }
  },
  Subscription: {
    newPost: {
      subscribe: () => pubsub.asyncIterator('NEW_POST')
    }
  },
  User: {
    posts: (parent) => posts.filter(post => post.authorId === parent.id)
  },
  Post: {
    author: (parent) => users.find(user => user.id === parent.authorId)
  }
};

// 创建 Apollo Server
const server = new ApolloServer({ typeDefs, resolvers });

// 应用中间件
const app = express();
server.applyMiddleware({ app, path: '/graphql' });

// 启动服务器
app.listen({ port: 4000 }, () => {
  console.log(`🚀 Server ready at http://localhost:4000${server.graphqlPath}`);
});
客户端实现

在客户端,我们可以使用 Apollo Client 来发送查询和变更请求。以下是一个使用 React 和 Apollo Client 的示例:

import React from 'react';
import { ApolloProvider, useQuery, gql } from '@apollo/client';

// 配置 Apollo Client
const client = new ApolloClient({
  uri: 'http://localhost:4000/graphql'
});

const GET_USER_WITH_POSTS = gql`
  query GetUserWithPosts($userId: ID!) {
    user(id: $userId) {
      id
      name
      email
      posts {
        id
        title
        content
        createdAt
      }
    }
  }
`;

function App() {
  const { loading, error, data } = useQuery(GET_USER_WITH_POSTS, {
    variables: { userId: '1' }
  });

  if (loading) return <p>Loading...</p>;
  if (error) return <p>Error: {error.message}</p>;

  return (
    <div>
      <h1>User: {data.user.name}</h1>
      <p>Email: {data.user.email}</p>
      <h2>Posts</h2>
      <ul>
        {data.user.posts.map(post => (
          <li key={post.id}>
            <h3>{post.title}</h3>
            <p>{post.content}</p>
            <p>Created At: {post.createdAt}</p>
          </li>
        ))}
      </ul>
    </div>
  );
}

function Root() {
  return (
    <ApolloProvider client={client}>
      <App />
    </ApolloProvider>
  );
}

export default Root;

总结

GraphQL 提供了一种强大且灵活的方式来构建和使用 API。通过精确的数据请求、强类型系统和单个端点设计,GraphQL 能够显著提高开发效率、优化性能并增强用户体验。同时,丰富的工具支持和生态系统使得 GraphQL 成为现代 Web 开发的重要选择之一。希望本文的介绍和示例能够帮助你更好地理解和应用 GraphQL。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2246018.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

FPGA 14 ,硬件开发板分类详解,FPGA开发板与普通开发板烧录的区别

目录 前言 在嵌入式系统开发中&#xff0c;硬件开发板是工程师常用的工具之一。不同类型的开发板有不同的特点和用途&#xff0c;其中最常见的两大类是普通开发板和FPGA开发板。这里分享记录&#xff0c;这两类开发板的分类&#xff0c;并深入探讨它们在烧录过程中的具体区别…

冲破AI 浪潮冲击下的 迷茫与焦虑

在这个科技日新月异的时代&#xff0c;人工智能如汹涌浪潮般席卷而来&#xff0c;不断改变我们的生活。你是否对 AI 充满好奇&#xff0c;却不知它将如何改变你的工作与生活&#xff1f;又是否会在 AI 浪潮的冲击下陷入迷茫与焦虑&#xff1f;《AI 时代&#xff1a;弯道超车新思…

时序论文23|ICML24谷歌开源零样本时序大模型TimesFM

论文标题&#xff1a;A DECODER - ONLY FOUNDATION MODEL FOR TIME - SERIES FORECASTING 论文链接&#xff1a;https://arxiv.org/abs/2310.10688 论文链接&#xff1a;https://github.com/google-research/timesfm 前言 谷歌这篇时间序列大模型很早之前就在关注&#xff…

Redis的基本使用命令(GET,SET,KEYS,EXISTS,DEL,EXPIRE,TTL,TYPE)

目录 SET GET KEYS EXISTS DEL EXPIRE TTL redis中的过期策略是怎么实现的&#xff08;面试&#xff09; 上文介绍reids的安装以及基本概念&#xff0c;本章节主要介绍 Redis的基本使用命令的使用 Redis 是一个基于键值对&#xff08;KEY - VALUE&#xff09;存储的…

大疆上云api开发

目前很多公司希望使用上云api开发自己的无人机平台,但是官网资料不是特别全,下面浅谈一下本人开发过程中遇到的一系列问题。 本人使用机场为大疆机场2&#xff0c;飞机为M3TD&#xff0c;纯内网使用 部署 链接: 上云api代码. 首先从github上面拉去代码 上云api代码github. 后…

实现管易云到金蝶云星空的数据无缝集成

管易云数据集成到金蝶云星空&#xff1a;案例分享 在企业信息化系统中&#xff0c;数据的高效流动和准确对接是业务顺利运行的关键。本文将聚焦于一个具体的系统对接集成案例——通过轻易云数据集成平台实现管易云数据到金蝶云星空的无缝迁移&#xff0c;方案名称为“wk_店铺_…

Ubuntu上安装MySQL并且实现远程登录

目录 下载网络工具 查看网络连接 更新系统软件包&#xff1b; 安装mysql数据库 查看mysql数据库状态 以数字ip形式显示mysql的监听状态。&#xff08;默认监听端口是3306&#xff09; 查看安装mysql数据库时系统创建的目录信息。 根据查询到的系统用户名以及随机密码&a…

卷积神经网络各层介绍

目录 1 卷积层 2 BN层 3 激活层 3.1 ReLU&#xff08;Rectified Linear Unit&#xff09; 3.2 sigmoid 3.3 tanh&#xff08;双曲正切&#xff09; 3.4 Softmax 4 池化层 5 全连接层 6 模型例子 1 卷积层 卷积是使用一个卷积核&#xff08;滤波器&#xff09;对矩阵进…

LVS

一、 lvs简介 LVS:Linux Virtual Server &#xff0c;负载调度器&#xff0c;内核集成&#xff0c;章文嵩&#xff0c;阿里的四层 SLB(Server LoadBalance) 是基 于 LVSkeepalived 实现 LVS 官网 : http://www.linuxvirtualserver.org/ LVS 相关术语 VS: Virtual Serve…

使用 Elastic AI Assistant for Search 和 Azure OpenAI 实现从 0 到 60 的转变

作者&#xff1a;来自 Elastic Greg Crist Elasticsearch 推出了一项新功能&#xff1a;Elastic AI Assistant for Search。你可以将其视为 Elasticsearch 和 Kibana 开发人员的内置指南&#xff0c;旨在回答问题、引导你了解功能并让你的生活更轻松。在 Microsoft AI Services…

掺铒光纤激光器

一、光纤激光器的特点 实现灵活的激光光源&#xff08;窄线宽、可调谐、多波长、超短光脉冲源&#xff09;易获得高功率、高的光脉冲能量激光波长与光纤通信传输窗口相匹配采用激光器泵浦形式&#xff08;半导体激光器泵浦&#xff09;热稳定性、价格低廉、易小型化 二、放大…

AP+AC组网——STA接入

扫描 主动扫描&#xff1a;STA发送Probe Request帧&#xff0c;AP收到回复Probe Response 可以带着SSID扫描寻找指定WIFI&#xff0c;也可以带着空SSID扫描进入周围可用WLAN 被动扫描&#xff1a; 客户端通过侦听AP定期发送的Beacon帧&#xff08;100TUs&#xff0c;1TU1024…

基于 ESP-AT (v3.x)固件通过 AT+SYSMFG 指令更新证书设置

AT 固件里的证书文件通过 mfg_nvs.csv 文件管理&#xff0c;所有证书都是写入 mfg_nvs 分区。可以先查看 mfg_nvs.csv 文件的内容来确定有哪些证书文件被管理&#xff0c;如下&#xff1a; 通过 AT 指令更新证书的方式如下&#xff1a; // 获取证书类型 ATSYSMFG&#xff1f;/…

投资策略规划最优决策分析

目录 一、投资策略规划问题详细 二、存在最优投资策略&#xff1a;每年都将所有钱投入到单一投资产品中 &#xff08;一&#xff09;状态转移方程 &#xff08;二&#xff09;初始条件与最优策略 &#xff08;三&#xff09;证明最优策略总是将所有钱投入到单一投资产品中…

android 性能分析工具(03)Android Studio Profiler及常见性能图表解读

说明&#xff1a;主要解读Android Studio Profiler 和 常见性能图表。 Android Studio的Profiler工具是一套功能强大的性能分析工具集&#xff0c;它可以帮助开发者实时监控和分析应用的性能&#xff0c;包括CPU使用率、内存使用、网络活动和能耗等多个方面。以下是对Android …

(UI自动化测试)web自动化测试

web自动化测试 UI自动化测试介绍 自动化测试理论&#xff1a; 图片上的文字等等不能做测试&#xff0c;只能发现固定的bug 工具选择及介绍 浏览器驱动&#xff1a;找元素--核心&#xff1a;驱动&#xff08;操作元素&#xff09;--通过代码

Web3与智能合约:区块链技术下的数字信任体系

随着互联网的不断发展&#xff0c;Web3代表着我们迈入了一个去中心化、更加安全和智能的网络时代。作为Web3的核心组成部分&#xff0c;区块链技术为智能合约的出现和发展提供了强有力的基础。智能合约不仅仅是自动化的代码&#xff0c;它们正逐步成为重塑数字世界信任体系的关…

AUTOSAR_EXP_ARAComAPI的7章笔记(6)

☞返回总目录 相关总结&#xff1a;ara::com 与 AUTOSAR 元模型的关系总结 7.4 ara::com 与 AUTOSAR 元模型的关系 在本文档中&#xff0c;我们一直在不涉及具体的AP元模型&#xff08;其清单部分&#xff09;的情况下解释 ara::com API的思想和机制&#xff0c;AP元模型是正…

浦语提示词工程实践(LangGPT版,服务器上部署internlm2-chat-1_8b,踩坑很多才完成的详细教程,)

首先&#xff0c;在InternStudio平台上创建开发机。 创建成功后点击进入开发机打开WebIDE。进入后在WebIDE的左上角有三个logo&#xff0c;依次表示JupyterLab、Terminal和Code Server&#xff0c;我们使用Terminal就行。&#xff08;JupyterLab可以直接看文件夹&#xff09;…

webgl threejs 云渲染(服务器渲染、后端渲染)解决方案

云渲染和流式传输共享三维模型场景 1、本地无需高端GPU设备即可提供三维项目渲染 云渲染和云流化媒体都可以让3D模型共享变得简单便捷。配备强大GPU的远程服务器早就可以处理密集的处理工作&#xff0c;而专有应用程序&#xff0c;用户也可以从任何个人设备查看全保真模型并与…