If you're interested in using the Shopify Storefront API in your theme development I've already written about how easy it is here. The one little snag is when trying to access Metafields.
I'm not sure the exact reason - though it may be because people stored things like private keys in metafields before knowing they might be available via a front-end api - metafields are not immediately available on the API.
Authenticated mutations to allow access to Metafields
The docs will tell you that you need to make an authenticated mutation, but if you've only been doing front-end development with the Storefront API it's not immediately clear how or where to do that.
Well, Shopify provides a graphql app that allows you to test your queries. However, you can also use this app to run authenticated mutations 🎉. You can find the app here.
Once you've installed it on your store, you can run the mutations below. You'll need to run a mutation for every metafield you want access to specifically.
mutation CreateMetafieldStorefrontVisibility($input: MetafieldStorefrontVisibilityInput) {
metafieldStorefrontVisibilityCreate(input: $input) {
metafieldStorefrontVisibility {
namespace
key
}
userErrors {
field
message
}
}
}
{
"input": {
"namespace": "custom",
"key": "bis_date",
"ownerType": "PRODUCTVARIANT"
}
}
It's worth noting that the namespace and keys are determined by the developer/storeowner and the ownerType is defined by Shopify. Here's a list of available ownerTypes:
- API_PERMISSION
- ARTICLE
- BLOG
- COLLECTION
- CUSTOMER
- DISCOUNT
- DRAFTORDER
- ORDER
- PAGE
- PRODUCT
- PRODUCTIMAGE
- PRODUCTVARIANT
- SHOP