Liens utiles:
Récemment, Shopify a publié un moyen de récupérer des méta-champs avec l'API Storefront . Afin d'obtenir un accès en lecture aux méta-champs à partir de l' API Shopify GraphQL Storefront, nous devons ajouter les méta-champs à la liste blanche de l' API Admin de Shopify GraphQL .
J'ai créé 2 plugins locaux:
gatsby-source-shopify-metafields
qui utilise graphql-request
pour updateMetafieldStorefrontVisibility
à updateMetafieldStorefrontVisibility
du métafield exact sur un produit. Pour exécuter la mutation updateMetafieldStorefrontVisibility
faites cd plugins/gatsby-source-shopify-metafields && node lib.js
gatsby-source-shopify
est une version mise à jour du default gatsby-source-shopify
avec les queries.js
, nodes.js
et gatsby-node.js
pour inclure le champ de metafields
nouvellement disponible. Après avoir exécuté updateMetafieldStorefrontVisibility
j'ai pu interroger les métafields du produit à l'aide de curl
:
require('dotenv').config({ path: `.env.${process.env.NODE_ENV}` }); module.exports = { siteMetadata: { title: `Gatsby Default Starter`, description: `Kick off your next, great Gatsby project with this default starter. This barebones starter ships with the main Gatsby configuration files you might need.`, author: `@gatsbyjs`, }, plugins: [ `gatsby-plugin-react-helmet`, { resolve: `gatsby-source-filesystem`, options: { name: `images`, path: `${__dirname}/src/images`, }, }, `gatsby-transformer-sharp`, `gatsby-plugin-sharp`, { resolve: 'gatsby-source-shopify', options: { shopName: `${process.env.SHOPIFY_SHOP_NAME}`, accessToken: `${process.env.SHOPIFY_STOREFRONT_ACCESS_TOKEN}`, verbose: true } }, { resolve: `gatsby-plugin-manifest`, options: { name: `gatsby-starter-default`, short_name: `starter`, start_url: `/`, background_color: `#663399`, theme_color: `#663399`, display: `minimal-ui`, icon: `src/images/gatsby-icon.png`, // This path is relative to the root of the site. }, }, // this (optional) plugin enables Progressive Web App + Offline functionality // To learn more, visit: https://gatsby.dev/offline // `gatsby-plugin-offline`, ], }
Réponse: {"data":{"productByHandle":{"metafield":{"value":"true"}}}}
Pour reproduire l'erreur, veuillez cloner ce dépôt
Sur gatsby develop
j'obtiens une Invariant Violation: Encountered an error trying to infer a GraphQL type
erreur de Invariant Violation: Encountered an error trying to infer a GraphQL type
:
gatsby develop success open and validate gatsby-configs â 0.004 s success load plugins â 0.368 s success onPreInit â 0.006 s success initialize cache â 0.094 s success copy gatsby files â 0.045 s success onPreBootstrap â 0.006 s gatsby-source-shopify/new-dev-sandbox starting to fetch data from Shopify gatsby-source-shopify/new-dev-sandbox fetched and processed blogs: 274.471ms gatsby-source-shopify/new-dev-sandbox fetched and processed policies: 278.416ms gatsby-source-shopify/new-dev-sandbox fetched and processed productTypes: 406.051ms gatsby-source-shopify/new-dev-sandbox fetched and processed articles: 641.547ms gatsby-source-shopify/new-dev-sandbox fetched and processed collections: 754.319ms gatsby-source-shopify/new-dev-sandbox fetched and processed products: 1832.663ms gatsby-source-shopify/new-dev-sandbox finished fetching data from Shopify: 1848.663ms success source and transform nodes â 1.903 s warning Multiple node fields resolve to the same GraphQL field `ShopifyCollection.products` - [`products`, `products___NODE`]. Gatsby will use `products___NODE`. warning Multiple node fields resolve to the same GraphQL field `ShopifyProduct.metafields` - [`metafields`, `metafields___NODE`]. Gatsby will use `metafields___NODE`. error UNHANDLED REJECTION Error: Invariant Violation: Encountered an error trying to infer a GraphQL type for: `metafields___ NODE`. There is no corresponding node with the `id` field matching: "Shopify__ProductMetafield__und efined,Shopify__ProductMetafield__undefined,Shopify__ProductMetafield__undefined,Shopify__ProductMe tafield__undefined". - invariant.js:40 invariant [gatsby-shopify-invariant-violation-example]/[invariant]/invariant.js:40:15 - add-inferred-fields.js:259 getFieldConfigFromFieldNameConvention [gatsby-shopify-invariant-violation-example]/[gatsby]/dist/schema/infer/add-inferred-fields.js:25 9:3 - add-inferred-fields.js:161 getFieldConfig [gatsby-shopify-invariant-violation-example]/[gatsby]/dist/schema/infer/add-inferred-fields.js:16 1:19 - add-inferred-fields.js:87 Object.keys.forEach.key [gatsby-shopify-invariant-violation-example]/[gatsby]/dist/schema/infer/add-inferred-fields.js:87 :25 - Array.forEach - add-inferred-fields.js:74 addInferredFieldsImpl [gatsby-shopify-invariant-violation-example]/[gatsby]/dist/schema/infer/add-inferred-fields.js:74 :28 - add-inferred-fields.js:38 addInferredFields [gatsby-shopify-invariant-violation-example]/[gatsby]/dist/schema/infer/add-inferred-fields.js:38 :3 - index.js:98 addInferredType [gatsby-shopify-invariant-violation-example]/[gatsby]/dist/schema/infer/index.js:98:3 - index.js:64 typesToInfer.map.typeComposer [gatsby-shopify-invariant-violation-example]/[gatsby]/dist/schema/infer/index.js:64:43 - Array.map - index.js:64 addInferredTypes [gatsby-shopify-invariant-violation-example]/[gatsby]/dist/schema/infer/index.js:64:23 - schema.js:140 [gatsby-shopify-invariant-violation-example]/[gatsby]/dist/schema/schema.js:140:11 - Generator.next
v2.5.2
v11.14.0
gatsby-config.js
:
curl -X POST \ "https://shop-name.myshopify.com/api/graphql.json" \ -H "Content-Type: application/graphql" \ -H "X-Shopify-Storefront-Access-Token: XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX" \ -d ' query { productByHandle(handle: "nike-air-max-720") { metafield(namespace: "global", key: "free_shipping") { value } } } '
Je m'attends à obtenir une construction propre, à la place, j'obtiens une Invariant Violation: Encountered an error trying to infer a GraphQL type
3 Réponses :
Exécutez gatsby clean
. Il s'agit d'une erreur de référence de nœud dans un fichier mis en cache.
lancez simplement "gatsby clean" pour supprimer le fichier cache
C'est un message d'erreur assez courant que j'ai vu lors de l'utilisation d'autres plugins de point de terminaison GraphQL avec Gatsby, par exemple. le avec WordPress. Habituellement, cela signifie que vous obtenez quelque chose comme
false
de l'API lorsque vous avez réellement besoin denull
, et / ou que vous avez construit le site Gatsby dans un environnement qui supposait qu'une sorte de données serait présente et maintenant sur un nouveau site Shopify que les données ne sont pas pas encore là. Dans ce cas, peut-être pas encore «Shopify__ProductMetafields»? Que voyez-vous dans l'interface GraphiQL? ( localhost: 8000 / ___ graphql )