{"id":333553,"date":"2022-05-10T05:27:09","date_gmt":"2022-05-10T05:27:09","guid":{"rendered":"https:\/\/webkul.com\/blog\/?p=333553"},"modified":"2024-02-22T06:22:51","modified_gmt":"2024-02-22T06:22:51","slug":"how-to-add-a-custom-field-to-graphql-schema","status":"publish","type":"post","link":"https:\/\/webkul.com\/blog\/how-to-add-a-custom-field-to-graphql-schema\/","title":{"rendered":"How to add a custom field to Graphql schema"},"content":{"rendered":"\n

GraphQl, a query language for the APIs. GraphQL provides a complete and understandable description of the data in your API, gives clients the power to ask for exactly what they need and nothing more, makes it easier to evolve APIs over time, and enables powerful developer tools.<\/p>\n\n\n\n

Here in this blog, we will get to know how we can add our custom field to a predefined GraphQl schema.<\/p>\n\n\n\n

Step 1<\/strong>: Register a custom module with registration.php and module.xml file.<\/p>\n\n\n\n

Step 2:<\/strong> Create schema.graphqls file inside etc folder i.e, VendorName\/CustomFieldGraphQl\/etc\/schema.graphqls
Here we will add our custom field customerFullName in customer API which will return the customer’s full name i.e, first name and last name.<\/p>\n\n\n\n

\n
\n
\n
\n
type Customer @doc(description: "Customer defines the customer name and address and other details") {\n    customerFullName: String @resolver(class:"\\\\VendorName\\\\CustomFieldGraphQl\\\\Model\\\\Resolver\\\\CustomerFullName")\n}<\/pre>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n
Step 3:<\/strong> Now define the resolver class ie. CustomerFullName.php in the defined path.
A resolver performs GraphQL request processing. In general, it is responsible for constructing a query, fetching data, and performing any calculations, then transforming the fetched and calculated data into a GraphQL array format. Finally, it returns the results wrapped by a callable function.<\/p>\n\n\n\n
<?php\n\/**\n * Copyright \u00a9 Magento, Inc. All rights reserved.\n * See COPYING.txt for license details.\n *\/\ndeclare(strict_types=1);\n\nnamespace VendorName\\CustomFieldGraphQl\\Model\\Resolver;\n\n\/**\n * CustomerFullName field resolver, used for GraphQL request processing.\n *\/\nclass CustomerFullName implements ResolverInterface\n{\n\n    \/**\n     * @inheritdoc\n     *\/\n    public function resolve(\n        Field $field,\n        $context,\n        ResolveInfo $info,\n        array $value = null,\n        array $args = null\n    ) {\n        \n        return 'John Doe';\n    }\n}<\/pre>\n\n\n\n
That’s all we have to do. Now we will get John Doe as a customer’s full name in customerFullName key in the customer API.<\/p>\n\n\n\n
Thank You
Happy Coding \ud83d\ude42<\/p>\n","protected":false},"excerpt":{"rendered":"
GraphQl, a query language for the APIs. GraphQL provides a complete and understandable description of the data in your API, gives clients the power to ask for exactly what they need and nothing more, makes it easier to evolve APIs over time, and enables powerful developer tools. Here in this blog, we will get to […]<\/a><\/p>\n","protected":false},"author":376,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[9121,302,1],"tags":[12690,12689],"class_list":["post-333553","post","type-post","status-publish","format-standard","hentry","category-magento-2","category-magento2","category-uncategorized","tag-custom-field-in-graphql","tag-graphql-custom-field"],"yoast_head":"\nHow to add a custom field to Graphql schema - Webkul Blog<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/webkul.com\/blog\/how-to-add-a-custom-field-to-graphql-schema\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How to add a custom field to Graphql schema - Webkul Blog\" \/>\n<meta property=\"og:description\" content=\"GraphQl, a query language for the APIs. GraphQL provides a complete and understandable description of the data in your API, gives clients the power to ask for exactly what they need and nothing more, makes it easier to evolve APIs over time, and enables powerful developer tools. Here in this blog, we will get to [...]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/webkul.com\/blog\/how-to-add-a-custom-field-to-graphql-schema\/\" \/>\n<meta property=\"og:site_name\" content=\"Webkul Blog\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/webkul\/\" \/>\n<meta property=\"article:published_time\" content=\"2022-05-10T05:27:09+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-02-22T06:22:51+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/webkul-og.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1200\" \/>\n\t<meta property=\"og:image:height\" content=\"630\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Deepak Tiwari\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@webkul\" \/>\n<meta name=\"twitter:site\" content=\"@webkul\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Deepak Tiwari\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"1 minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/webkul.com\/blog\/how-to-add-a-custom-field-to-graphql-schema\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/webkul.com\/blog\/how-to-add-a-custom-field-to-graphql-schema\/\"},\"author\":{\"name\":\"Deepak Tiwari\",\"@id\":\"https:\/\/webkul.com\/blog\/#\/schema\/person\/f1f005cfc0c9af7f93910041dce67985\"},\"headline\":\"How to add a custom field to Graphql schema\",\"datePublished\":\"2022-05-10T05:27:09+00:00\",\"dateModified\":\"2024-02-22T06:22:51+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/webkul.com\/blog\/how-to-add-a-custom-field-to-graphql-schema\/\"},\"wordCount\":212,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/webkul.com\/blog\/#organization\"},\"keywords\":[\"Custom field in graphql\",\"GraphQl custom field\"],\"articleSection\":[\"Magento 2\",\"Magento2\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/webkul.com\/blog\/how-to-add-a-custom-field-to-graphql-schema\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/webkul.com\/blog\/how-to-add-a-custom-field-to-graphql-schema\/\",\"url\":\"https:\/\/webkul.com\/blog\/how-to-add-a-custom-field-to-graphql-schema\/\",\"name\":\"How to add a custom field to Graphql schema - Webkul Blog\",\"isPartOf\":{\"@id\":\"https:\/\/webkul.com\/blog\/#website\"},\"datePublished\":\"2022-05-10T05:27:09+00:00\",\"dateModified\":\"2024-02-22T06:22:51+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/webkul.com\/blog\/how-to-add-a-custom-field-to-graphql-schema\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/webkul.com\/blog\/how-to-add-a-custom-field-to-graphql-schema\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/webkul.com\/blog\/how-to-add-a-custom-field-to-graphql-schema\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/webkul.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"How to add a custom field to Graphql schema\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/webkul.com\/blog\/#website\",\"url\":\"https:\/\/webkul.com\/blog\/\",\"name\":\"Webkul Blog\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/webkul.com\/blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/webkul.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/webkul.com\/blog\/#organization\",\"name\":\"WebKul Software Private Limited\",\"url\":\"https:\/\/webkul.com\/blog\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/webkul.com\/blog\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/webkul-logo-accent-sq.png\",\"contentUrl\":\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/webkul-logo-accent-sq.png\",\"width\":380,\"height\":380,\"caption\":\"WebKul Software Private Limited\"},\"image\":{\"@id\":\"https:\/\/webkul.com\/blog\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/webkul\/\",\"https:\/\/x.com\/webkul\",\"https:\/\/www.instagram.com\/webkul\/\",\"https:\/\/www.linkedin.com\/company\/webkul\",\"https:\/\/www.youtube.com\/user\/webkul\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/webkul.com\/blog\/#\/schema\/person\/f1f005cfc0c9af7f93910041dce67985\",\"name\":\"Deepak Tiwari\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/webkul.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/d6f4542bf07455806d05215f870ee8d6ab4bfbdcd1446d3a3143de3b6b0680ba?s=96&d=https%3A%2F%2Fcdnblog.webkul.com%2Fblog%2Fwp-content%2Fuploads%2F2019%2F10%2Fmike.png&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/d6f4542bf07455806d05215f870ee8d6ab4bfbdcd1446d3a3143de3b6b0680ba?s=96&d=https%3A%2F%2Fcdnblog.webkul.com%2Fblog%2Fwp-content%2Fuploads%2F2019%2F10%2Fmike.png&r=g\",\"caption\":\"Deepak Tiwari\"},\"url\":\"https:\/\/webkul.com\/blog\/author\/deepak-tiwari301\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"How to add a custom field to Graphql schema - Webkul Blog","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/webkul.com\/blog\/how-to-add-a-custom-field-to-graphql-schema\/","og_locale":"en_US","og_type":"article","og_title":"How to add a custom field to Graphql schema - Webkul Blog","og_description":"GraphQl, a query language for the APIs. GraphQL provides a complete and understandable description of the data in your API, gives clients the power to ask for exactly what they need and nothing more, makes it easier to evolve APIs over time, and enables powerful developer tools. Here in this blog, we will get to [...]","og_url":"https:\/\/webkul.com\/blog\/how-to-add-a-custom-field-to-graphql-schema\/","og_site_name":"Webkul Blog","article_publisher":"https:\/\/www.facebook.com\/webkul\/","article_published_time":"2022-05-10T05:27:09+00:00","article_modified_time":"2024-02-22T06:22:51+00:00","og_image":[{"width":1200,"height":630,"url":"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/webkul-og.png","type":"image\/png"}],"author":"Deepak Tiwari","twitter_card":"summary_large_image","twitter_creator":"@webkul","twitter_site":"@webkul","twitter_misc":{"Written by":"Deepak Tiwari","Est. reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/webkul.com\/blog\/how-to-add-a-custom-field-to-graphql-schema\/#article","isPartOf":{"@id":"https:\/\/webkul.com\/blog\/how-to-add-a-custom-field-to-graphql-schema\/"},"author":{"name":"Deepak Tiwari","@id":"https:\/\/webkul.com\/blog\/#\/schema\/person\/f1f005cfc0c9af7f93910041dce67985"},"headline":"How to add a custom field to Graphql schema","datePublished":"2022-05-10T05:27:09+00:00","dateModified":"2024-02-22T06:22:51+00:00","mainEntityOfPage":{"@id":"https:\/\/webkul.com\/blog\/how-to-add-a-custom-field-to-graphql-schema\/"},"wordCount":212,"commentCount":0,"publisher":{"@id":"https:\/\/webkul.com\/blog\/#organization"},"keywords":["Custom field in graphql","GraphQl custom field"],"articleSection":["Magento 2","Magento2"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/webkul.com\/blog\/how-to-add-a-custom-field-to-graphql-schema\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/webkul.com\/blog\/how-to-add-a-custom-field-to-graphql-schema\/","url":"https:\/\/webkul.com\/blog\/how-to-add-a-custom-field-to-graphql-schema\/","name":"How to add a custom field to Graphql schema - Webkul Blog","isPartOf":{"@id":"https:\/\/webkul.com\/blog\/#website"},"datePublished":"2022-05-10T05:27:09+00:00","dateModified":"2024-02-22T06:22:51+00:00","breadcrumb":{"@id":"https:\/\/webkul.com\/blog\/how-to-add-a-custom-field-to-graphql-schema\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/webkul.com\/blog\/how-to-add-a-custom-field-to-graphql-schema\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/webkul.com\/blog\/how-to-add-a-custom-field-to-graphql-schema\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/webkul.com\/blog\/"},{"@type":"ListItem","position":2,"name":"How to add a custom field to Graphql schema"}]},{"@type":"WebSite","@id":"https:\/\/webkul.com\/blog\/#website","url":"https:\/\/webkul.com\/blog\/","name":"Webkul Blog","description":"","publisher":{"@id":"https:\/\/webkul.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/webkul.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/webkul.com\/blog\/#organization","name":"WebKul Software Private Limited","url":"https:\/\/webkul.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/webkul.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/webkul-logo-accent-sq.png","contentUrl":"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2021\/08\/webkul-logo-accent-sq.png","width":380,"height":380,"caption":"WebKul Software Private Limited"},"image":{"@id":"https:\/\/webkul.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/webkul\/","https:\/\/x.com\/webkul","https:\/\/www.instagram.com\/webkul\/","https:\/\/www.linkedin.com\/company\/webkul","https:\/\/www.youtube.com\/user\/webkul\/"]},{"@type":"Person","@id":"https:\/\/webkul.com\/blog\/#\/schema\/person\/f1f005cfc0c9af7f93910041dce67985","name":"Deepak Tiwari","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/webkul.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/d6f4542bf07455806d05215f870ee8d6ab4bfbdcd1446d3a3143de3b6b0680ba?s=96&d=https%3A%2F%2Fcdnblog.webkul.com%2Fblog%2Fwp-content%2Fuploads%2F2019%2F10%2Fmike.png&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/d6f4542bf07455806d05215f870ee8d6ab4bfbdcd1446d3a3143de3b6b0680ba?s=96&d=https%3A%2F%2Fcdnblog.webkul.com%2Fblog%2Fwp-content%2Fuploads%2F2019%2F10%2Fmike.png&r=g","caption":"Deepak Tiwari"},"url":"https:\/\/webkul.com\/blog\/author\/deepak-tiwari301\/"}]}},"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/posts\/333553","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/users\/376"}],"replies":[{"embeddable":true,"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/comments?post=333553"}],"version-history":[{"count":3,"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/posts\/333553\/revisions"}],"predecessor-version":[{"id":366800,"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/posts\/333553\/revisions\/366800"}],"wp:attachment":[{"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/media?parent=333553"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/categories?post=333553"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/webkul.com\/blog\/wp-json\/wp\/v2\/tags?post=333553"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}