GraphQL 的实时数据推送实现方式-JavaScript中文网-JavaScript教程资源分享门户

GraphQL 的实时数据推送实现方式

GraphQL 是一种新兴的 API 查询语言和运行时，它允许客户端请求指定的数据，并返回精确的数据。在现代 SPA 应用程序中，数据是经常更改的，并希望能够实时推送给客户端，以便用户能够及时获得最新状态。本文将介绍 GraphQL 的实时数据推送实现方式。

GraphQL 订阅

GraphQL 订阅是一种允许客户端订阅特定事件并在事件发生时接收实时更新的机制。GraphQL 订阅基于长轮询（long-polling）技术，即客户端发送一个查询，服务器将保持连接，直到事件发生或连接超时。

以下是一个简单的 GraphQL 订阅示例：

------------ -
  ---------- -
    --
    ----
    ------
    --------
  -
-

上面的订阅查询订阅了 newMessage 事件，并定义了要接收的数据字段。当有新的消息发送时，服务器将返回新的数据。如果没有新的数据，服务器将保持连接并等待新的事件发生。

实现实时数据推送

实现 GraphQL 实时数据推送的方式有多种，以下是两种常用的方式：

使用 PubSub

PubSub（发布/订阅）是一种在应用程序内部或跨应用程序间进行消息传递的模式。PubSub 有多种实现方式，例如 Redis、Apollo Server 等。

以下是使用 Redis 实现 GraphQL 实时数据推送的示例：

------ - ------ - ---- ------------------------
----- ------ - --- ---------

-- ---
----- ----------- - --------------
----- --------- - -
  ------------- -
    ----------- -
      ---------- -- -- -----------------------------------
    -
  -
-

-- ---
----- -------------- - ----- -- -- -
  ----- ------- - ----- ----------------
  --------------------------- - ----------- ------- ---
-

上面的示例中，pubsub 实例化了一个 PubSub 对象，NEW_MESSAGE 定义了订阅事件名称。在订阅器中，asyncIterator 方法返回一个可观察对象，当事件发生时，该对象将在客户端处触发。在发布者中，通过 publish 方法将新的数据发布到订阅器中。

使用 WebSocket

WebSocket 是一种在客户端和服务器之间保持长连接的协议，允许双方在任何时候实时交换消息。WebSocket 可以很好地支持 GraphQL 实时数据推送。

以下是使用 WebSocket 实现 GraphQL 实时数据推送的示例：

----- ---------- - ------------------
----- -------- - --- --------------------
  --------
  ----------
  ------
-- -
  ------- -----------
  ----- ----------
---

-- ---
----- --------- - -
  ------------- -
    ----------- -
      ---------- ------------- -- ------------------------------------ --------- ---------- -- -
        ------ ------------------------- -----------
      --
    -
  -
-

-- ---
----- -------------- - ----- -- -- -
  ----- ------- - ----- ----------------
  ----- --------------------------- - ----------- ------- ---
  ------------------------------------ -------------- -- -
    ----- ------- - -
      ----- -
        ----------- -------
      -
    --
    ----- -------------------------------------------
  ---
-

上面的示例中，SubscriptionServer 创建了一个 WebSocket 服务器，withFilter 方法允许过滤订阅的数据。在发布者中，通过 pubsub.publish 方法发布新数据，并将新数据发送到所有订阅的客户端。

结论

GraphQL 实时数据推送有多种实现方式，其中 PubSub 和 WebSocket 是最常用的两种方式。它们有各自的优点和适用场景。开发者可以根据实际需求选择最适合自己的实现方式。GraphQL 的实时数据推送在现代 SPA 应用程序中发挥重要作用，可以提高应用程序的用户体验。

来源：JavaScript中文网，转载请联系管理员！本文地址：https://www.javascriptcn.com/post/66ef64e66fbf9601972f053c