Hello!
I'm developing a store with the Storefront API using the js-buy-sdk and we're having issues retrieving an Image src from a MetaField.
I'm getting an internal server error:
[
{
"message": "Internal error. Looks like something went wrong on our end.\nRequest ID: 97995dfd-f5ab-4f41-8f73-e833fea39364 (include this in support requests).",
"extensions": {
"code": "INTERNAL_SERVER_ERROR",
"requestId": "97995dfd-f5ab-4f41-8f73-e833fea39364"
}
}
]
Context:
First, we fetch the product details with the MetaField like so:
// from a productByHandle query
// ...
product.add(
'metafield',
{
alias: 'size_chart',
args: {
key: 'size_chart',
namespace: 'details',
},
},
(metafield) => {
metafield.add('key')
metafield.add('value')
}
)
// ...
This works, but it returns a global file id:
{
"id": "Z2lkOi8vc2hvcGlmeS9NZXRhZmllbGQvMTk4MjEzMjU1NDk3NDE=",
"key": "size_chart",
"value": "gid://shopify/MediaImage/22086478004397"
}
Now I've tried many things, the furthest I've reached is trying to fetch the image src with a node query, but I'm getting the error above
My imageQuery looks like this:
const imageQuery = client.graphQLClient.query((root) => {
root.add(
"node",
{
args: { id },
},
(node) => {
node.addInlineFragmentOn("MediaImage", (mediaImage) => {
mediaImage.add("image", (image) => {
image.add("originalSrc", { alias: "src" });
image.add("altText");
});
});
}
);
});
const { model, errors } = await client.graphQLClient.send(imageQuery);
I've tried encoding the "gid://..." id with both window.btoa(size_chart.value) and Buffer.from(size_chart.value).toString('base64') with no luck
Please help! Thanks a lot!
