GraphQL how to get videos

aveshopstech
Shopify Partner
32 1 20

Is there any way to only retrieve the videos related to a product with the GraphQL Admin API? The video object doesn't seem to be queryable from root, and when querying from context of a product, you can only get images or ALL media (which includes images, 3D, videos, etc.). There's no query param on the media object, so you can't filter by mediaContentType. Am I missing something, or is there just no way to get only video media resources? My current solution would be to get all media resources for a product, then loop through each to filter out the videos (per query below). Anyone have a better way to do this? Thanks!

 

 

 

{
  product(id: "gid://shopify/Product/5089364312199") {
    id,
    title,
    media(first:20) {
      edges {
        node {
          mediaContentType,
          status,
          ... on Video {
            filename,
            originalSource {
              url,
            }
          }
        }
      }
    }
  }
}

 

 

Replies 2 (2)
Luke_K
Shopify Staff
Shopify Staff
402 65 92

Hey @aveshopstech 

Had you tried using GraphQL Fragments for this one by chance? Something like this below, when I pass in the Product's GID, gives me the Video mediaContentType only for my product (my test product has other mediaContentTypes too - images and so forth).  Let me know if that helps at all!

 

{
  product(id: "gid://shopify/Product/xxxxxxxxxxxxxx") {
    media(first: 20) {
      edges {
        node {
          ...fieldsForMediaTypes
        }
      }
    }
  }
}

fragment fieldsForMediaTypes on Media {
  ... on Video {
    id
    mediaContentType
    status
    preview {
      image {
        altText
        originalSrc
      }
    }
  }
}

 

 

| Shopify |
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution!
aveshopstech
Shopify Partner
32 1 20

Thanks much for the reply and idea. Interesting... I never thought to use fragments like that. Doing it as you suggest essentially returns an empty node for any non-video media type, since return fields are only defined for video media. I suppose this is better since there is less data across the wire, but the process will still be similar since I'll have to check each node. In this case using the fragment, I'll check for an empty node vs my original solution of checking for a specific value on a node, but the results will still need to be filtered. That being said, I like your solution better due to the way it results in the response being just a bit lighter. Thanks again for the tip.