datocms listen

Посетите домашнюю страницу DatoCMS или посмотрите, что такое DatoCMS?

---

datocms-слушать

Легкий пакет с поддержкой TypeScript, который предлагает утилиты для работы с API обновлений в реальном времени DatoCMS внутри браузера.

Установка

 npm install datocms-listen

Пример

Импортируйте subscribeToQuery из datocms-listen и используйте его внутри своих компонентов следующим образом:

 import { subscribeToQuery } from "datocms-listen" ;

const unsubscribe = await subscribeToQuery ( {
  query : `
    query BlogPosts($first: IntType!) {
      allBlogPosts(first: $first) {
        title
        nonExistingField
      }
    }
  ` ,
  variables : { first : 10 } ,
  token : "YOUR_TOKEN" ,
  includeDrafts : true ,
  onUpdate : ( update ) => {
    // response is the GraphQL response
    console . log ( update . response . data ) ;
  } ,
  onStatusChange : ( status ) => {
    // status can be "connected", "connecting" or "closed"
    console . log ( status ) ;
  } ,
  onChannelError : ( error ) => {
    // error will be something like:
    // {
    //   code: "INVALID_QUERY",
    //   message: "The query returned an erroneous response. Please consult the response details to understand the cause.",
    //   response: {
    //     errors: [
    //       {
    //         fields: ["query", "allBlogPosts", "nonExistingField"],
    //         locations: [{ column: 67, line: 1 }],
    //         message: "Field 'nonExistingField' doesn't exist on type 'BlogPostRecord'",
    //       },
    //     ],
    //   },
    // }
    console . error ( error ) ;
  } ,
  onError : ( error ) => {
    // error will be
    // {
    //   message: "ERROR MESSAGE"
    // }
    console . log ( error . message ) ;
  } ,
  onEvent : ( event ) => {
    // event will be
    // {
    //   status: "connected|connected|closed",
    //   channelUrl: "...",
    //   message: "MESSAGE",
    // }
  } ,
} ) ; 

Параметры инициализации

опора	тип	необходимый	описание	по умолчанию
запрос	строка | TypedDocumentNode	✅	Запрос GraphQL для подписки
жетон	нить	✅	Токен API DatoCMS для использования
onUpdate	функция	✅	Функция обратного вызова для получения событий обновления запроса
onChannelError	функция		Функция обратного вызова для получения событий ChannelError
onStatusChange	функция		Функция обратного вызова для получения событий изменения статуса
onError	функция		Функция обратного вызова для получения событий об ошибках
onEvent	функция		Функция обратного вызова для получения других событий
переменные	Объект		Переменные GraphQL для запроса
включить черновики	логическое значение		Если это правда, черновики записей будут возвращены.
исключитьИнвалид	логическое значение		Если true, недействительные записи будут отфильтрованы.
среда	нить		Имя среды DatoCMS, в которой следует выполнить запрос (по умолчанию — основная среда).
контентСсылка	'vercel-1' или undefined		Если это правда, встройте метаданные, которые включают Content Link.
baseEditingUrl	нить		Базовый URL-адрес проекта DatoCMS.
кэшТеги	логическое значение		Если это правда, получите теги кэша, связанные с запросом.
период повторного подключения	число		В случае сетевых ошибок период (в мс) ожидания повторного подключения.	1000
сборщик	функция, подобная выборке		Функция выборки, используемая для выполнения запроса на регистрацию.	окно.fetch
класс eventSourceClass	класс, подобный EventSource		Класс EventSource, используемый для открытия соединения SSE.	окно.EventSource
базовый URL-адрес	нить		Базовый URL-адрес, который будет использоваться для выполнения запроса.	https://graphql-listen.datocms.com

События

onUpdate(update: UpdateData<QueryResult>)

Эта функция будет вызываться каждый раз, когда канал отправляет обновленный результат запроса. Аргумент updateData имеет следующие свойства:

опора	тип	описание
ответ	Объект	Обновленный ответ GraphQL

onStatusChange(status: ConnectionStatus)

Аргумент status представляет состояние соединения с событиями, отправленными сервером. Это может быть одно из следующих:

• connecting : канал подписки пытается подключиться
• connected : канал открыт, мы получаем обновления в реальном времени
• closed : канал был окончательно закрыт из-за фатальной ошибки (т. е. неверного запроса).

onChannelError(errorData: ChannelErrorData)

Аргумент errorData имеет следующие свойства:

опора	тип	описание
код	нить	Код ошибки (т.е. INVALID_QUERY )
сообщение	нить	Удобное для человека сообщение, объясняющее ошибку
ответ	Объект	Необработанный ответ, возвращаемый конечной точкой, если он доступен.

onError(error: ErrorData)

Эта функция вызывается при возникновении ошибок соединения.

Аргумент error имеет следующие свойства:

опора	тип	описание
сообщение	нить	Удобное для человека сообщение, объясняющее ошибку

onEvent(event: EventData)

Эта функция вызывается тогда, когда происходят другие события.

Аргумент event имеет следующие свойства:

опора	тип	описание
статус	нить	Текущий статус подключения (см. выше)
URL-адрес канала	нить	Текущий URL канала
сообщение	нить	Дружелюбное сообщение, объясняющее событие

Возвращаемое значение

Функция возвращает Promise<() => void> . Вы можете вызвать функцию, чтобы корректно закрыть канал SSE.

---

Что такое ДатоCMS?

DatoCMS — это безголовая CMS REST и GraphQL для современного Интернета.

Пользователи DatoCMS, которым доверяют более 25 000 корпоративных предприятий, партнеров-агентств и частных лиц по всему миру, создают масштабный онлайн-контент из центрального узла и распространяют его через API. Мы ❤️наши разработчики, редакторы контента и маркетологи!

Быстрые ссылки:

• ⚡️ Начните работу с бесплатной учетной записи DatoCMS.
• ? Пройтись по документации
• Получите поддержку от нас и сообщества
• ? Будьте в курсе новых функций и исправлений в журнале изменений.

Наши избранные репозитории:

• datocms/react-datocms: вспомогательные компоненты React для изображений, рендеринга структурированного текста и многого другого.
• datocms/js-rest-api-clients: клиенты JavaScript для узлов и браузеров для обновления и администрирования вашего контента. Для получения данных из внешнего интерфейса мы рекомендуем вместо этого использовать API доставки контента GraphQL.
• datocms/cli: интерфейс командной строки, включающий наш импортер Contentful и импортер Wordpress.
• datocms/plugins: примеры созданных нами плагинов, расширяющих панель редактора/администратора.
• В DatoCMS Starters есть примеры для различных фреймворков внешнего интерфейса Javascript.

Или просмотрите все наши публичные репозитории