Magento2 – How to Use Customer Token to Access Account Query or Mutation in GraphQL

If I am not wrong you meant to ask What if we’re adding a custom attribute, e.g., an attribute we’ve added to the database? And how we gonna deal with making that attribute available to GraphQL. So let's proceed with an example:

Let’s assume you want to add the parent_item_id as an attribute available through the GraphQL Quote Endpoint.Now, you may already be aware, parent_item_id is an existing field (it’s not a new database attribute). But currently, it’s not supported through the native GraphQL Quote Endpoint – so it’s not accessible via GraphQL responses. We’ll walk through a simple example to add it:

First, We’ll create a module:

// File: app/code/GraphQlHandson/Example/registration.php
<?php

\Magento\Framework\Component\ComponentRegistrar::register(
    \Magento\Framework\Component\ComponentRegistrar::MODULE,
    'GraphQlHandson_Example',
    __DIR__
);

Next, We’ll add our etc/schema.graphqls file:

// File: app/code/GraphQlHandson/Example/etc/schema.graphqls
interface CartItemInterface @typeResolver(class: "Magento\\QuoteGraphQl\\Model\\Resolver\\CartItemTypeResolver") {
    parent_item_id: Int
}

Now, refresh your database / cache:

php bin/magento setup:upgrade

…That’s it! On the client side, We can send a GraphQL query that looks like this:

query { cart { items { parent_item_id } } }

(Obviously in a real-world scenario, you would request additional information).

Now, the only point that confusing at first glance is the interface definition in the schema.graphqls file. …Where did we get that? Well, if you look in the native Quote graphql module:

// File>: vendor/magento/module-quote-graph-ql/etc/schema.graphqls
...
type SimpleCartItem implements CartItemInterface @doc(description: "Simple Cart Item") {
    customizable_options: [SelectedCustomizableOption] @resolver(class: "Magento\\QuoteGraphQl\\Model\\Resolver\\CustomizableOptions")
}

type VirtualCartItem implements CartItemInterface @doc(description: "Virtual Cart Item") {
    customizable_options: [SelectedCustomizableOption] @resolver(class: "Magento\\QuoteGraphQl\\Model\\Resolver\\CustomizableOptions")
}

interface CartItemInterface @typeResolver(class: "Magento\\QuoteGraphQl\\Model\\Resolver\\CartItemTypeResolver") {
    id: String!
    quantity: Float!
    product: ProductInterface!
}
...

You can see above, that by default Magento 2 does several things:

• Defines an interface CartItemInterface which is used to represent cart items.
• Defines concrete implementations of that interface for different product types.

• Defines the fields available through GraphQL for each of them.

  So, by default, the only available fields for an item are id, quantity, product — the last of which is a complex ProductInterface type

In our custom module, all we did was copy the interface definition and start adding new properties to it.

That’s an important point to remember – the GraphQL definitions function more like layout xml in Magento 2, and less like typical extension_attributes. The beauty of this is that we can freely add new types, modify queries, etc.

Hope this provide a clear glimpse on how you can modify the GraphQL queries by adding custom or new attributes. If yes, then kindly upvote it and mark it as an answer. Thanks!

There is already an in-built GraphQl query to retrieve customer data. You can get core Magento customer data via below query.

 {
  customer {
    firstname
    lastname
    suffix
    email
    id
    addresses {
      firstname
      lastname
      street
      city
      region {
        region_code
        region
        region_id
      }
      postcode
      country_id
      telephone
    }
  }
}

The above GraphQl request will return a response shown as below.

{
  "data": {
    "customer": {
      "firstname": "John",
      "lastname": "Doe",
      "suffix": null,
      "email": "jdoe@example.com",
      "id": 3,
      "addresses": [
       {
         "firstname": "John",
         "lastname": "Doe",
         "street": [
           "123 Elm Street"
         ],
         "city": "Anytown",
         "region": {
           "region_code": "MI",
           "region": "Michigan",
           "region_id": 33
         }
         "postcode": "78758",
         "country_id": "US",
         "telephone": "512 555-1212"
        }
      ]
    }
  }
}

Refer the developer documents for more information. https://devdocs.magento.com/guides/v2.3/graphql/queries/customer.html

If you want to return your custom customer attributes via GraphQl, instead of writing a new query, you can enhance the existing customer GraphQl query.

1. Assume you want to append a new customer attribute 'occupation' to the existing customer query. First you need to add this information in your schema.graphqls file.

app/code/YourNamespace/YourModuleGraphQl/etc/schema.graphqls

type Customer {
    occupation: String @resolver(class: "YourNamespace\\YourModuleGraphQl\\Model\\Resolver\\Customer\\Occupation")
}

'String' is the output data type when you request occupation parameter in customer query.

2. Now create your resolver class to prepare the data for this custom attribute.

app/code/YourNamespace/YourModuleGraphQl/Model/Resolver/Customer/Occupation.php

 <?php

    declare(strict_types=1);

    namespace YourNamespace\YourModuleGraphQl\Model\Resolver\Customer;

    use Magento\Framework\Exception\NoSuchEntityException;
    use Magento\Framework\GraphQl\Config\Element\Field;
    use Magento\Framework\GraphQl\Exception\GraphQlInputException;
    use Magento\Framework\GraphQl\Exception\GraphQlNoSuchEntityException;
    use Magento\Framework\GraphQl\Query\ResolverInterface;
    use Magento\Framework\GraphQl\Schema\Type\ResolveInfo;

    class Occupation implements ResolverInterface
    {

        protected $storeManager;

        // You can inject relevant classes in this constructor function.
        public function __construct(
            \Magento\Store\Model\StoreManagerInterface $storeManager
        )
        {
            $this->storeManager = $storeManager;
        }

        // This is the function which will get invoked when we request 'occupation' info in the graphql query 
        public function resolve(Field $field, $context, ResolveInfo $info, array $value = null, array $args = null)
        {
            if (!isset($value['model'])) {
                throw new LocalizedException(__('"model" value should be specified'));
            }
            $output = [];
            $customer = $value['model'];
            $customerId = (int)$customer->getId();

            // Get the custom attribute info of the customer.
            $occupation = $this->getCustomerOccupationInfo($customerId);
            $output[
                    'occupation' => $occupation;
                ];
            return $output;
        }

        private function getCustomerOccupationInfo($customerId)
        {
            // Get the value of customer's occupation attribute and return it.
            return 'Teacher';
        }
    }

3. Run below commands.

bin/magento setup:upgrade

rm -rf generated/

bin/magento c:f

4. Below is an example of the customer query, which implies how you can call your 'occupation' attribute inside customer query.

{
      customer {
        firstname
        lastname
        suffix
        email
        id
        occupation
        }
    }