Генерация схемы GraphQL — интеграция с WPGraphQL | Field Forge - Произвольные поля, созданные для скорости
Скачать Войти

Генерация схемы GraphQL — интеграция с WPGraphQL

Проблема WPGraphQL + пользовательские поля

WPGraphQL — это уровень API GraphQL для WordPress. Он предоставляет посты, страницы, таксономии и пользователей в виде схемы GraphQL, которую может запрашивать фронтенд на JavaScript. Это отлично — за исключением одной большой проблемы: он не знает о пользовательских полях.

Если вы хотите запрашивать пользовательские поля через WPGraphQL, у вас традиционно есть три варианта:

  1. WPGraphQL для ACF — отдельный плагин, который считывает определения полей ACF и предоставляет их. Работает для пользователей ACF и SCF, но требует ручной настройки для сложных групп полей.
  2. Пользовательские типы WPGraphQL — напишите код на PHP, чтобы вручную зарегистрировать каждый тип пользовательского поля в WPGraphQL. Чрезвычайно утомительно.
  3. Используйте REST API вместо этого — REST API WordPress действительно предоставляет пользовательские поля, но он менее эффективен, чем GraphQL для сложных запросов.

Подход Field Forge: автоматическая регистрация типов WPGraphQL в момент активации обоих плагинов. Никакого кода. Никакой ручной регистрации. Ваши пользовательские поля становятся доступными для запроса через GraphQL немедленно.


Как это работает

Шаг 1: Установите Field Forge и WPGraphQL

Оба плагина должны быть активны. WPGraphQL — это уровень API GraphQL; Field Forge предоставляет определения типов и резолверы для пользовательских полей.

Шаг 2: Field Forge обнаруживает WPGraphQL при активации

Когда Field Forge активируется (или WPGraphQL активируется после Field Forge), Field Forge сканирует ваши группы полей и автоматически регистрирует:

  • Типы GraphQL для каждой группы полей (например, HeroSectionFields, TeamMemberFields)
  • Типы GraphQL для вложенных повторителей, групп и гибких макетов контента
  • Типы объединения для гибкого контента с несколькими макетами
  • Резолверы, которые извлекают значения полей из пользовательского хранилища таблиц Field Forge

Шаг 3: Запрос через WPGraphQL

Ваши пользовательские поля сразу становятся доступными для запроса:

«graphql query GetPage { page(id: "home", idType: SLUG) { title fieldforge { heroSection { title subtitle backgroundImage { id sourceUrl altText mediaDetails { width height } } ctaButton { text url openInNewTab } } } } } «

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


Скачиваемая GraphQL SDL

Field Forge также позволяет вам скачать чистый язык определения схемы GraphQL (SDL) для ваших групп полей. Это полезно для:

  • Генерации кода — инструменты, такие как GraphQL Code Generator, могут читать SDL и создавать типы TypeScript
  • Документации — публикуйте схему для вашей команды или потребителей API
  • Тестирования — используйте SDL для имитации ответов в тестах
  • Инструментов — схемосознательные IDE GraphQL, такие как GraphQL Playground, могут автоматически дополнять запросы

Нажмите Скачать GraphQL SDL в админке Field Forge, чтобы получить файл .graphql:

«`graphql type HeroSectionFields { title: String subtitle: String backgroundImage: MediaItem ctaButton: CtaButtonGroup }

type CtaButtonGroup { text: String url: String openInNewTab: Boolean }

type TeamMemberFields { name: String photo: MediaItem bio: String skills: [SkillSubField] }

type SkillSubField { skillName: String proficiency: Int } «`


Вложенные и сложные типы

GraphQL естественным образом обрабатывает вложенные типы. Field Forge генерирует:

Поля повторителей → массивные типы

«`graphql type TeamPage { teamMembers: [TeamMemberRow] }

type TeamMemberRow { name: String photo: MediaItem bio: String } «`

Гибкий контент → типы объединения

«`graphql type LandingPage { pageSections: [PageSectionLayout] }

union PageSectionLayout = HeroLayout | FeaturesLayout | CTALayout

type HeroLayout { title: String subtitle: String backgroundImage: MediaItem }

type FeaturesLayout { sectionTitle: String features: [FeatureItem] }

type CTALayout { headline: String button: ButtonGroup } «`

Запрос объединенных типов в GraphQL требует использования встроенных фрагментов:

«graphql query GetLandingPage { page(id: "home", idType: SLUG) { fieldforge { pageSections { __typename ... on HeroLayout { title subtitle backgroundImage { sourceUrl } } ... on FeaturesLayout { sectionTitle features { title description } } ... on CTALayout { headline button { text url } } } } } } «

Это стандартная идиома GraphQL. Результат — полностью типизированный массив, где каждый элемент имеет правильную форму для своего макета.


Поля отношений → типы соединений

Реляционные поля (объект поста, связь, пользователь, таксономия) создают правильные типы соединений GraphQL:

«graphql type ProductFields { relatedProducts: [Post] # Тип поста автоматически разрешается в тип поста WPGraphQL author: User # Тип пользователя автоматически разрешается category: [Category] # Таксономические термины автоматически разрешаются } «

Типы Post, User и Category являются встроенными типами WPGraphQL. Field Forge интегрируется с ними нативно — поле связанного поста разрешается в полный объект Post WPGraphQL со всеми его полями, доступными для запроса.

«graphql query GetProduct { post(id: "product-a") { fieldforge { productDetails { relatedProducts { title slug featuredImage { node { sourceUrl } } } } } } } «


Работает с GraphQL Code Generator

Если вы используете GraphQL Code Generator в вашем фронтенд-проекте, автоматически зарегистрированная схема GraphQL Field Forge работает из коробки. Настройте codegen.yml, чтобы исследовать вашу конечную точку GraphQL WordPress:

«yaml schema: https://wp.example.com/graphql documents: './src/**/*.graphql' generates: ./src/gql/: preset: client plugins: [] «

Запустите graphql-codegen, и вы получите полностью типизированные хуки запросов GraphQL для вашего фронтенда с интегрированными типами Field Forge.


Field Forge против WPGraphQL для ACF

WPGraphQL для ACF — это отдельный плагин, разработанный командой WPGraphQL, который предоставляет группы полей ACF (и SCF) в GraphQL. Он работает, но это отдельный плагин для управления, и иногда отстает от обновлений ACF.

Field Forge объединяет интеграцию GraphQL как основную функцию. Вам не нужно устанавливать отдельный плагин. Интеграция поддерживается как часть цикла выпуска Field Forge. Каждый тип поля поддерживается нативно.

Для сайтов, использующих ACF + WPGraphQL для ACF, переход на Field Forge означает один плагин меньше и лучшую интеграцию.


Производительность

Запросы GraphQL в настройке Field Forge + WPGraphQL выигрывают от пользовательского хранилища таблиц и интеграции кэша объектов Field Forge. Сложный запрос, извлекающий множество постов с несколькими группами полей, выполняется за несколько SQL-запросов, а не за сотни, которые бы сгенерировал наивный подход на основе wp_postmeta.


Готовы к пользовательским полям GraphQL?

Получите Field Forge — от $35/год →

Генерация GraphQL и интеграция с WPGraphQL включены в каждый платный план.

ИИ-ассистент Forge Онлайн

Привет! Я ИИ-ассистент Field Forge. Спрашивайте меня о чём угодно по плагину — настройка, возможности, устранение неполадок или разработка.

Только что
На базе Forge AI · Просмотр документации