How to randomise qraphql query results?

Question

I'm trying to develop filters by passing a query string in the below productFetch() function and want to show only 28 products on the screen returned from the query below. How to make graphql query return random 28 products instead of the first 28?

  query productFetch($first: Int, $after: String, $query: String) {
    products(first: $first, after: $after, query: $query) {
      edges {
        node {
          priceRange {
            minVariantPrice {
              amount
              currencyCode
            }
          }
          title
          images(first: 1) {
            edges {
              node {
                transformedSrc(maxWidth: 300)
              }
            }
          }
        }
        cursor
      }
      pageInfo {
        hasNextPage
      }
    }
  }

score 0 · Answer 1 · answered Jun 30 '21 at 09:31

The short answer is you can't with only graphql.

The GraphQL returns what ever you requested, there is no way to tell it to randomize it as of now.

You can use the sortKey and reverse arguments to create some fake randomize, but you will be limited to the "random" response depending on the products.

So if you want random products get more than 28 and randomize them using JS. While you are limited on how many products you can pull with a single request it will at least have a random output. If you add the sortKey and reverse logic the randomize will increase as well.

How to randomise qraphql query results?

1 Answers1