本文属于机器翻译版本。若本译文内容与英语原文存在差异，则一律以英文原文为准。

# 在中创建由无服务器 pub/sub APIs WebSockets 提供支持的通用部件 AWS AppSync
<a name="aws-appsync-real-time-create-generic-api-serverless-websocket"></a>

**重要**  
从 2025 年 3 月 13 日起， WebSockets 您可以使用 AWS AppSync 事件构建实时 PubSub API。有关更多信息，请参阅[事件开发者指南 WebSocket中的通过发布AWS](https://docs.aws.amazon.com/appsync/latest/eventapi/publish-websocket.html)*AppSync 事件*。

有些应用程序只要求客户收听特定频道或主题的简单 WebSocket APIs 功能。对于没有特定形状或强类型要求的通用 JSON 数据，可以将其推送到使用纯粹且简单的发布-订阅 (Pub/Sub) 模式侦听这些通道之一的客户端。

通过在 API 后端 pub/sub WebSocket APIs 和客户端自动生成 GraphQL 代码，可以在几分钟内轻松实现 GraphQL 知识。 AWS AppSync 

## 创建和配置 pub-sub APIs
<a name="aws-appsync-real-time-enhanced-filtering-using-pub-sub-apis"></a>

首先，执行以下操作：

1. 登录 AWS 管理控制台 并打开[AppSync 控制台](https://console.aws.amazon.com/appsync/)。

   1. 在**控制面板**中，选择**创建 API**。

1. 在下一个屏幕上，选择**创建一个实时 API**，然后选择**下一步**。

1. 输入您的 pub/sub API 的友好名称。

1. 您可以启用[私有 API](https://docs.aws.amazon.com/appsync/latest/devguide/using-private-apis.html) 功能，但我们建议暂时关闭该功能。选择**下一步**。

1. 您可以选择使用自动生成有效的 pub/sub API WebSockets。我们建议暂时也关闭该功能。选择**下一步**。

1. 选择**创建 API**，然后等待几分钟。将在您的账户中创建一个新的预配置 AWS AppSync 发布/订阅 API。 AWS 

API 使用内置 AWS AppSync的本地解析器（有关使用本地解析器的更多信息，请参阅*《AWS AppSync 开发者指南》*中的[教程：本地解析器](https://docs.aws.amazon.com/appsync/latest/devguide/tutorial-local-resolvers-js.html)）来管理多个临时 pub/sub 通道和 WebSocket 连接，它仅根据频道名称自动向订阅的客户端传送和筛选数据。API 调用通过 API 密钥进行授权。

在部署 API 后，您需要执行几个额外的步骤以生成客户端代码，并将其与客户端应用程序集成在一起。本指南使用一个简单的 React Web 应用程序，以提供如何快速集成客户端的示例。

1. 首先，在本地计算机上使用 [NPM](https://www.npmjs.com/get-npm) 创建一个样板 React 应用程序：

   ```
   $ npx create-react-app mypubsub-app 
   $ cd mypubsub-app
   ```
**注意**  
该示例使用 [Amplify 库](https://docs.amplify.aws/lib/)将客户端连接到后端 API。不过，无需在本地创建 Amplify CLI 项目。虽然 React 是该示例中选择的客户端，但 Amplify 库还支持 iOS、Android 和 Flutter 客户端，并在这些不同的运行时系统中提供相同的功能。[支持的Amplify客户端提供了简单的抽象，只需几行代码即可与Gr AWS AppSync aphQL API后端进行交互，包括与实时协议完全兼容的内置 WebSocket功能：AWS AppSync WebSocket ](https://docs.aws.amazon.com/appsync/latest/devguide/real-time-websocket-client.html)  

   ```
   $ npm install @aws-amplify/api
   ```

1. 在 AWS AppSync 控制台中，选择 “下载” **JavaScript**，**下载**包含 API 配置详细信息和生成的 GraphQL 操作代码的单个文件。

1. 将下载的文件复制到 React 项目中的 `/src` 文件夹。

1. 接下来，将现有的样板 `src/App.js` 文件内容替换为控制台中提供的示例客户端代码。

1. 使用以下命令在本地启动该应用程序：

   ```
   $ npm start
   ```

1. 要测试实时数据的发送和接收，请打开两个浏览器窗口并访问*localhost:3000*。示例应用程序配置为将通用 JSON 数据发送到名*robots*为的硬编码频道。

1.  在其中的一个浏览器窗口中，在文本框中输入以下 JSON Blob，然后单击**提交**：

   ```
   {
     "robot":"r2d2",
     "planet": "tatooine"
   }
   ```

两个浏览器实例都订阅了该*robots*频道并实时接收发布的数据，这些数据显示在 Web 应用程序的底部：

![\[适用于 pub/sub API 的 React 应用程序示例\]](http://docs.aws.amazon.com/zh_cn/appsync/latest/devguide/images/pub-sub-react.png)


所有必需的 GraphQL API 代码（包括架构、解析器和操作）都会自动生成，以启用通用 pub/sub 用例。在后端，数据通过 GraphQL 突变发布到 AWS AppSync的实时端点，如下所示：

```
mutation PublishData {
    publish(data: "{\"msg\": \"hello world!\"}", name: "channel") {
        data
        name
    }
}
```

订阅者通过相关的 GraphQL 订阅访问发送到特定临时通道的发布数据：

```
subscription SubscribeToData {
    subscribe(name:"channel") {
        name
        data
    }
}
```

## 在现有应用程序中实现 pub- APIs sub
<a name="aws-appsync-real-time-enhanced-filtering-existing-apps"></a>

如果您只需要在现有应用程序中实现实时功能，则可以轻松地将此通用 pub/sub API 配置集成到任何应用程序或 API 技术中。虽然使用单个 API 端点通过 GraphQL 在单个网络调用中安全地访问、操作和合并来自一个或多个数据源的数据具有优势，但无需从头开始转换或重建基于 REST 的现有应用程序即可利用的 AWS AppSync实时功能。例如，您可以将现有 CRUD 工作负载放在单独的 API 端点中，客户端仅出于实时 pub/sub 目的从现有应用程序向通用 pub/sub API 发送和接收消息或事件。