Fetching metafields value for Shopify cart transform function

English Shopify Shopify Apps
, , , ,
1

Hi,

I am trying to show the images in checkout page that is uploaded in variants metafield using Shopify cart transform API. Below are RunInput:

query RunInput {
  cart {
    lines {
      id
       merchandise {
        __typename
        ... on ProductVariant {
          id
          title
          product{
            title
            	# Access the metafield value to determine the cost of the warranty
            variantImage: metafield(namespace: "$app:custom", key: "variant_image_1") {
              type
              value
            }
          }
          metafield(namespace: "$app:custom", key: "variant_image_1") {
              type
              value
            }
        }
      }
    }
  }
   cartTransform {
    # Access the variant ID that represents the warranty product
    variantImage: metafield(namespace: "$app:custom", key: "variant_image_1") {
              type
              value
            }
  }
}

But, the Input show null. Please find the screenshot below.

Screenshot 2024-05-06 at 8.43.57 AM.png
Screenshot 2024-05-06 at 8.43.57 AM.png1645×886 104 KB

Below is the metafields configuration in my store. Any insights are high appreciated.

sushilsth21_0-1714964450235.png
sushilsth21_0-1714964450235.png826×762 38.1 KB

2

As far as I know the metafield you are setting up is a shop metafield and the metafield you are setting in the code is an app metafield. let me explain,

when you wrote $app:custom it means that the metafield will be created within the app. so if you would have to run a GraphQL mutation to run make that metafield (The mutation is called MetafieldSet) this is how it should be done but based on your query, I suggest that you should change the query to the one below I hope this helps.

query RunInput {
  cart {
    lines {
      id
       merchandise {
        __typename
        ... on ProductVariant {
          id
          title
          product{
            title
            	# Access the metafield value to determine the cost of the warranty
            variantImage: metafield(namespace: "custom", key: "variant_image_1") {
              type
              value
            }
          }
          metafield(namespace: "custom", key: "variant_image_1") {
              type
              value
            }
        }
      }
    }
  }
   cartTransform {
    # Access the variant ID that represents the warranty product
    variantImage: metafield(namespace: "custom", key: "variant_image_1") {
              type
              value
            }
  }
}

If you find this informative please leave a like that would be really great.

1 Like
3

This worked like perfect. This is my first app using shopify function.

4

@sushilsth21 how were you able to show the image from the metafield as the line item image? The value for me that returned was something like this

gid://shopify/MediaImage/

so not the actual cdn URL. Can you please show the code you used to return the CDN URL?

5

@rsilvadev Yes, I also got into this problem and there was no ways to the solution so, I used metafield type URL and inserted the image URL there instead of using metafield type image. Hope this helps.