Skip to content

Can't receive messages in a chat using subscriptionΒ #1521

@agustin-mesa

Description

@agustin-mesa

Describe the bug
Hey!
I'm migrating a project from Nuxt 2 to Nuxt 3, with @nuxtjs/apollo: 4.0.1-rc.5 to @nuxtjs/apollo: 5.0.0-alpha.6, and also aws-appsync, in which I have a chat in which I'm not receiving in real time the message from the other person. I can send and the other person receives it, but I don't receive the messages. The chat is an EvMessenger.vue component where I render in a setup a useMessenger.js composable.
I would think that the problem is in the subscription, because when the observable.subscribe() component is mounted it is executed only once, but when I want to receive a message it is not executed, and that should happen, right?
I attach a function in which I use in a composable of Vue the apollo subscription. This function is executed in an onMounted so that it can be rendered.

   const loadMessages = () => {
    const observable = client.watchQuery({
      query: GET_MESSAGES_BY_CONVERSATION_ID,
      variables: {
        conversationId,
        first: app.$messenger.constants.messageFirst,
      },
    })

    observable.subscribe(({ data }) => {
      const newMessages = data.allMessageConnection.messages
      messages.value = [...newMessages].reverse()
      loading.value = false
      nextToken.value = data.allMessageConnection.nextToken
    })
    observable.subscribeToMore({
      document: SUBSCRIBE_TO_NEW_MESSAGES,
      variables: { conversationId },
      updateQuery: (
        previousMessages,
        {
          subscriptionData: {
            data: { subscribeToNewMessage: message },
          },
        },
      ) => {
        return app.$messenger.unshiftMessage(previousMessages, message)
      },
    })
    observedQuery.value = observable
  }

Expected behavior
Receive messages in real time mode.

Versions
vue: 3
@nuxt/apollo: 5.0.0-alpha.6
aws-appsync: ^4.1.9

Additional context
In the previous Nuxt 2 project, everything worked fine, but now in the migration it does not.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions