Генерація схеми GraphQL — Інтеграція WPGraphQL | Field Forge - Кастомні поля, створені для швидкості
Завантажити Увійти

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

Проблема WPGraphQL + кастомні поля

WPGraphQL — це шар API GraphQL для WordPress. Він відкриває публікації, сторінки, таксономії та користувачів як схему GraphQL, яку може запитувати JavaScript фронтенд. Це чудово — за винятком однієї великої прогалини: він не знає про кастомні поля.

Якщо ви хочете запитувати кастомні поля через WPGraphQL, у вас традиційно є три варіанти:

  1. WPGraphQL для ACF — окремий плагін, який читає визначення полів ACF і відкриває їх. Працює для користувачів ACF та SCF, але вимагає ручної конфігурації для складних груп полів.
  2. Кастомні типи WPGraphQL — написати PHP код для реєстрації кожного типу кастомного поля вручну. Надзвичайно нудно.
  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 для імітації відповідей у тестах
  • Інструментів — схеми, обізнані про GraphQL IDE, такі як 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] # Тип публікації автоматично вирішується до типу 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, щоб інспектувати ваш WordPress GraphQL кінцевий пункт:

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 · Переглянути документацію