在Amplify中以条件筛选的方式实时订阅更新

简而言之

Amplify在@model中自动生成的订阅会自动通知所有事情。以聊天为例,无论哪个聊天室发布了聊天消息,都会收到通知。不过实际上,应该只想接收特定聊天室的通知。

这种情况在公式文件中有说明,但是说明不够清晰,而且没有写到最后,所以我做了个笔记来记录方法。

前提 (Qian ti)

假设存在如下模式:
Chat是指聊天室,ChatMessage是在其中进行交流的用户消息。

type Chat @model {
  id: ID!
  title: String!
}

type ChatMessage @model {
  id: ID!
  chatId: ID!
  body: String
}

步骤

禁用Amplify的自动订阅生成。

首先,在 ChatMessage 的 @model 中添加 subscriptions: null,以防止自动创建 Subscription。

type ChatMessage @model(subscriptions: null) { # <-- これ
  id: ID!
  chatId: ID!
  body: String
}

在这个阶段执行 amplify push。如果不这样做,后续的步骤中当推送自定义定义的Subscription时,将会与Amplify已经自动生成的Subscription发生冲突并导致错误。

% amplify push

定义一个带有参数的Subscription

写一个以 chatId 作为参数的 Subscription。当然,需要指定 ChatMessage 类型中存在的字段。

type Subscription {
  onCreateChatMessage(chatId: ID): ChatMessage @aws_subscribe(mutations: ["createChatMessage"])
}

`onCreateChatMessage` 函数的返回类型是 `ChatMessage`,因此它是一个 `ChatMessage` 对象。
在 `@aws_subscribe` 中,我们需要指定希望订阅的 `mutation`。在这种情况下,它是 `createChatMessage`。

使用这个命令再次执行 amplify push。

只需要一个选项,在客户端应用程序中使用

很幸运地,由于Amplify会自动生成其他一切,因此之后只需要从客户端应用程序调用即可。对于JS,代码如下所示。使用graphqlOperation函数,可见我们添加的chatId参数是如何传递的。

import { API, graphqlOperation } from 'aws-amplify'

// 通知の受け取りを開始する
const subscription = API.graphql(
  graphqlOperation(subscriptions.onCreateChatMessage, { chatId: currChatId }),
).subscribe({
  next: ({ provider, value }) => {
    console.log(value.data.onCreateChatMessage)
  },
  error: error => console.warn(error),
})

// 通知を止める(SPAなどで更新が不要になった場合など)
subscription.unsubscribe()

给予额外的东西

由此引发的Amplify生成代码的变化如下。

amplify/backend/api/myapi/build/schema.graphql の Subscription が自分で追加した onCreateChatMessage に置き換わる。
自動生成してくれるsubscriptionのGraphQL(今回の場合onCreateChatMessage)がパラメータ付きに変わる。(JSの場合、 graphql/subscriptions.js にあたる。)

解析器没有变化。似乎只需通过更改GraphQL模式和GraphQL语句来添加参数。

广告
将在 10 秒后关闭
bannerAds