Solved

Fetching draft products with the storefront API

Wakers
Visitor
2 0 0

I am looking to fetch draft products with the storefront api so I can continue to develop locally with draft products and not use an entirely different API just so I can work with draft products in my local development environment.

I have tried querying the status, only to fetch all active products.

 

 

products(first: 10, query: "status:draft") {
    edges {
      node {
        title
      }
    }
  }

 

 

 

Accepted Solution (1)

Liam
Shopify Staff
2731 299 769

This is an accepted solution.

Hi Wakers,

 

Typically you'd use the Shopify Admin API to make requests to products and filter based on the `status` field, eg: GET /admin/api/2023-07/products.json?status=draft

 

If you really need to only use the Storefront API and want to simulate a "draft" environment, one workaround could be:

 

  • Use a specific tag (e.g., "draft_for_dev") for products you consider as drafts.
  • Fetch products with this tag using the Storefront API.
  • Ensure that products with this tag are not visible to your real customers. You can do this by not publishing them to the sales channels or by using some theme logic to hide products with this tag.


However, this approach has its limitations, involves some manual work, and might not be suitable for all use cases. It's a bit of a hack and is more of a workaround than a true solution, so I'd recommend using the Admin API to work with draft products.

 

Hope this helps!

Liam | Developer Advocate @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit Shopify.dev or the Shopify Web Design and Development Blog

View solution in original post

Replies 3 (3)

Liam
Shopify Staff
2731 299 769

This is an accepted solution.

Hi Wakers,

 

Typically you'd use the Shopify Admin API to make requests to products and filter based on the `status` field, eg: GET /admin/api/2023-07/products.json?status=draft

 

If you really need to only use the Storefront API and want to simulate a "draft" environment, one workaround could be:

 

  • Use a specific tag (e.g., "draft_for_dev") for products you consider as drafts.
  • Fetch products with this tag using the Storefront API.
  • Ensure that products with this tag are not visible to your real customers. You can do this by not publishing them to the sales channels or by using some theme logic to hide products with this tag.


However, this approach has its limitations, involves some manual work, and might not be suitable for all use cases. It's a bit of a hack and is more of a workaround than a true solution, so I'd recommend using the Admin API to work with draft products.

 

Hope this helps!

Liam | Developer Advocate @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit Shopify.dev or the Shopify Web Design and Development Blog

Wakers
Visitor
2 0 0

Thanks for the reply Liam. That's a great help.

 

As long as I know the storefront API is not intended to fetch draft products I can set it up properly with the admin API.

marnau
Shopify Partner
8 0 2

Something that complicates this a bit would be the following: what if I want to query archived or draft products in a certain locale?

 

Only the Storefront API has an inContext directive, and only the Admin API can query archived or draft products, right?

Any idea how to approach this?

 

Thanks a lot