Many-to-many-fields work in Pimcore GraphQL (data-hub), though it might take you some time to figure out how it exactly works.

If you haven’t added data-hub, read this post first about data-hub.

Many-to-one field

Say we have object Fridge and object Brand. Object Fridge has a many-to-one field with Object Brand.

In order for this to work you have to add both object Fridge and Brand in the Schema Query.

Select the fields you want to be available in GraphQL for both objects (Fridge and Brand).
Select also the folders of the objects that should be available (in tab Security Definition under "objects"). They need to include the folders from both objects .

Click save.

Click "Open in Tab", this opens the editor ‘GraphiQL’ in a new browser tab.

Enter a variant of this query:

{
    getFridge (id: 141) {
        id,
        name,
        description,
        brand {
            ... on object_Brand {
                name
            }
        }
    }
}

The Many To One field requires:

  • the field name as it’s defined in the Fridge class (brand in this example)
  • 3 dots (…) followed by the fixed word object_ followed by the class name of the linked object (... on object_brand in this example)
  • the field names that you want to return from the brand.

Many-to-many fields

If you work with a many-to-many fields, you work exactly as in many-to-one fields. The only difference is an extra line in the query.

  • the fixed word element
{
    getFridge (id: 141) {
        id,
        name,
        description,
        brand {
            element {
                ... on object_Brand {
                    name
                }
            }
        }
    }
}

I discovered in some cases it also works without the "… on object_" line.

Possible errors:

Cannot query field "name" on type "object_Brand".

This happens when you didn’t add the object in the Schema Definition of the Datahub configuration.
The linked objects must also be defined.

Error "type definition … not found"

This was a bug on "Advanced Many-To-Many Object Relation" types. It’s fixed in the dev-mater branch of data-hub. See: https://github.com/pimcore/data-hub/issues/39

Execute the following command to fix this:

composer update pimcore/data-hub

Pimcore 5 offers a new package to use GraphQL. That way you can make Pimcore 5 headless. This means you can access Pimcore data, without having to visit that website, and without using REST or SOAP. The package for GraphQL is called data-hub and is still in dev, though it already works.

Add GraphQL (data-hub) package to Pimcore

  1. Add the "GraphQL" package to Pimcore with Composer. The package is called data-hub.

    composer require pimcore:data-hub:dev-master
  2. The package needs to be activated an installed. Go in Pimcore to Tools (tool-icon) > Extensions

  3. Click on the green plus-button on the line "PimcoreDataHub" (column Enable/Disable).

  4. You see a confirmation window. Click that away.

  5. Click on the install-icon on the same line.

  6. Refresh the browser.

Configure the data-hub.

If all goes well, you should see the "Datahub config" option under the Settings menu (gear-icon). If not, ensure the package is properly installed (or try to reinstall it).

To add a GraphQL configuration, clicking the "Add Configuration" button and select "GraphQL".

Scheme Definition

Click the Schema Definition tab .

First add the object-type you want to be queryable. In this example I use a custom object called "Fridge". (step 1)

To configure this object, click the gear icon (step 2).

You see the fields of this object in the left column. Drag and drop the fields you want to enable for the GraphQL query to the right column.

Security Definition

Click the Security Definition tab. (step 1)

Your api (= GraphQL service) must be protected by an api-key, to limit unauthorized access. The party (or application) that needs to query the data, must have a copy of that key. (step 2)

Now that you’ve configured the object, you must also select the folder of the objects that must be query-able. Objects outside those folders won’t be found. Drag and drop a folder in "Objects". (step 3)

Click "save" (step 4).

Enter queries

Click "Open in tab" to start experimenting.

The query-language of GraphQL is explained on the official GraphQL website, so I won’t go into detail about that.

{
  getFridge (id: 141) {
    id,
    name,
    description
  }
}

You can enter this as a test and you should see the results after clicking on the play-button (arrow) in the top bar.


You say "getFridge" with id 141; show the fields: name, id, description

You can only select the fields you’ve configured in the scheme definition. So if you want more fields, you have to go back to the configuration window.

Access api

You can access the api through the following url:

http://mysite.com/pimcore-graphql-webservices/fridge?apikey=abc

Where you replace: "mysite.com", "fridge" (by the name of the configuration) and "abc" by the api-key.

Then you send to that api the complete query (with the braces), for instance with an ApolloClient (not covered in this blogpost). You should get the appropriate response.


Wordpress.org clearPaper by CreativeBits.it Copyright © 2012-2019 Robin Brackez. All rights reserved. By visiting this site you agree to accept cookies that are purely used to check how many visitors I have. Theme by: creativebits. Custom adaptations by Robin Brackez.