Apollo "Поле подписки должно возвращать Async Iterable. Получено: не определено"

У меня есть мутация, которая запускает событие канала "countIncr", но я не вижу, чтобы активная соответствующая подписка срабатывала с полезной нагрузкой события.

ОБНОВЛЕНИЕ: я внес несколько обновлений в эту публикацию, и теперь я меняю заголовок, чтобы он лучше отражал то, где я нахожусь.

Я получаю ошибку graphqlPlayground

"Subscription field must return Async Iterable. Received: undefined"

Воспроизведение TGRstack, с которым у меня проблемы:https://github.com/TGRstack/tgr-apollo-subscription-example-microservice/

Рабочая репродукция без TGRstack:https://github.com/Falison/fullstack-apollo-subscription-example

Apollo "Поле подписки должно возвращать Async Iterable. Получено: не определено"Apollo "Поле подписки должно возвращать Async Iterable. Получено: не определено"Apollo "Поле подписки должно возвращать Async Iterable. Получено: не определено"Apollo "Поле подписки должно возвращать Async Iterable. Получено: не определено"Apollo "Поле подписки должно возвращать Async Iterable. Получено: не определено"Apollo "Поле подписки должно возвращать Async Iterable. Получено: не определено"Apollo "Поле подписки должно возвращать Async Iterable. Получено: не определено" Внешний интерфейс: https://github.com/TGRstack/tgr-apollo-subscription-example-microservice/blob/master/counter-ui/src/app/routes/Home/HomePage.tsx

const COUNTER_SUBSCRIPTION = gql`
subscription onCountIncr {
  count
}
`

const Counter = () => (
  <Subscription
    subscription = {COUNTER_SUBSCRIPTION}
  >
    {({ data, loading }) => {
      console.info({loading, data})
      return loading
        ? <h1>Loading ...</h1>
        : data.count
          ? <h2>Counter: {data.count}</h2>
          : <h1>Counter Subscription Not Available</h1>
    }}
  </Subscription>
)

BE-преобразователи: https://github.com/TGRstack/tgr-apollo-subscription-example-microservice/blob/master/counter-service/src/gql/Resolvers.ts

BE-схема: https://github.com/TGRstack/tgr-apollo-subscription-example-microservice/blob/master/counter-service/src/gql/Schema.ts

ВЕ-контроллер: https://github.com/TGRstack/tgr-apollo-subscription-example-microservice/blob/master/counter-service/src/gql/Counter.ts

const count = {
  resolve: data => {
    console.info('CounterSub>', {data})
    return data
  },
  subscribe: () => pubsub.asyncIterator(['countIncr'])
}

const CounterSubscriptions = {
  count
}
async function countIncr(root: any, args: any, context: any) {
  const count = Counter.increment()
  await pubsub.publish('countIncr', count )
  console.info('countIncr', '>>>', { count })
  return count
}

Вот журнал обслуживания после выполнения инструкций #gettingstarted в файле Readme.md.

[FE] GET /favicon.ico 200 2.465 ms - 1551                   # WEBCLIENT LOADED
[BE] CounterSub> { data: undefined }                        # SUBSCRIPTION REQUEST
[BE] { data: [Object: null prototype] { count: null } }     # SUBSCRIPTION RESULT
[BE] POST / 200 21.254 ms - 24
[BE] 2019-05-10 11:37:20 [info]:     HELLO                  # APOLLO CLIENT CONNECTED AGAIN (why always 2?)
[BE] countIncr >>> { count: 1 }                             # MUTATION REQUEST
[BE] { data: [Object: null prototype] { countIncr: 1 } }    # MUTATION RESPONSE
[BE] POST / 200 13.159 ms - 25
[BE] countIncr >>> { count: 2 }                             # MUTATION REQUEST
[BE] { data: [Object: null prototype] { countIncr: 2 } }    # MUTATION RESPONSE
[BE] POST / 200 4.380 ms - 25

ОБНОВИТЬ

Если вы пытались клонировать репозиторий, и после запуска nps это не сработало, потому что в nps setup пропущен шаг. Я отправил обновление в стек с улучшенным nps setup.

ОБНОВЛЕНИЕ 2

обновленный код и рассматриваемые ссылки для последней фиксации

ОБНОВЛЕНИЕ 3

Некоторые люди предположили, что pubsub должен быть единственным импортом. Я обновил код, но это создает новую ошибку:

Error: Apollo Server requires either an existing schema, modules or typeDefs

ОБНОВЛЕНИЕ 4

многочисленные незначительные изменения, пытающиеся выследить ошибки импорта/экспорта (?), теперь вызывают ошибку. Я исправил эту ошибку, укрепив импорт (была проблема с некорректным экспортом индексного файла).

"message": "Subscription field must return Async Iterable. Received: undefined"

Рабочая репродукция без TGRstack: https://github.com/Falison/fullstack-apollo-subscription-example

Обновление 5

Я демодулировал/декомпозировал кучу вещей, чтобы было легче отслеживать, что происходит, но все равно получаю ту же ошибку.

Этот ответ здесь решил мою проблему.

Shamxeed 25.08.2021 16:41
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
11
1
3 999
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Я решил эту проблему в 2 местах

  1. ApolloServer.installSubscriptionHandler() ВРЕМЕННО заменяет middleware.apolloSubscriptions() . Я настраиваю промежуточное программное обеспечение подписки, следуя этому руководству: https://www.apollographql.com/docs/graphql-subscriptions/express, поэтому я собираюсь предположить, что что-то не так с версией одного из этих пакетов или самим руководством.

    ApolloServer.installSubscriptionHandlers(ws)

    const listener = ws.listen({port: config.PORT}, () => {
      middleware.apolloSubscriptions(ws)
      // middleware.apolloSubscriptions(ws)
  1. terminatingLink и getMainDefinition необходимы для клиента https://github.com/TGRstack/tgr-apollo-subscription-example-microservice/commit/75b6165f2dc1d035a41f1129f7386a1e18c7ba53#diff-2c47ef33b8ed0e4c893cbc161bcf7814R37
  private _terminatingLink = split(
    ({ query }) => {
      const { kind, operation } = getMainDefinition(query)
      return (
        kind === 'OperationDefinition' && operation === 'subscription'
      )
    },
    this._wsLink,
    this._httpLink,
  )

Другие вопросы по теме