product variant metafield using storefront api graphql

[Bandile]

I need to get a products variant metafield and i am able to get the  metafield using the admin graphql api but not using the storefront api this needs to take in a product variant id as an argument 

query = """

{

  productVariant(id: "gid://shopify/ProductVariant/{variant-id}") {

    id

    title

    metafields(first: 5) {

      edges {

        node {

          id

          namespace

          key

          value

        }

      }

    }

  }

}

    """

but struggling the get the same results with the storefont api i do see it the storefront api does not have the same query roots as the admin api so i tried using the node query root as a staring point but im getting errors can you please help me 

{

  node(id: "gid://shopify/ProductVariant/{variant-id}") {

    ... on ProductVariant {

      id

      metafield(key: "product_page", namespace: "buyout_price") {

        id

        key

        value

      }

    }

  }

}

example of the code im using for the storefont version 

[EcomGraduates]

, it seems that you are trying to retrieve a specific metafield for a product variant using its key and namespace. However, the metafield query for the Storefront API requires the id of the metafield instead.

Here is an example query that should work for you:

{
  productVariant(id: "gid://shopify/ProductVariant/{variant-id}") {
    id
    title
    metafields(first: 5) {
      edges {
        node {
          id
          key
          namespace
          value
        }
      }
    }
  }
}

This query should return the metafields for the specified product variant, including their id, key, namespace, and value.

[Bandile · Accepted solution]

that does not work for the storefront api

const query = `
{
node(id: "${variantId}") {
... on ProductVariant {
id
title
metafield(key: "buyout_price", namespace: "product_page") {
value
id
}
}
}
}
`;

got it though