How can I properly use GraphQL checkout query in my Next.js frontend?

I’m building a frontend for Shopify (using Next.js / React if this could be useful) but i stuck at working with checkout.

i am able to create a checkout with a

mutation {

    checkoutCreate
...
}

the mutation return a checkout id, but when i use the checkout id to access the checkout using

query  {

    node(id: "NEWLY CREATED CHECKOUT ID") {

      id

      ... on Checkout {

        id

        createdAt

        email

        lineItems(first:10){

          edges {

            node {

              quantity

              title

            }

          }

        }

      }

    }

  }

i got back an empty result. The fact is that if i copy/paste the query in the graphql tool inside Shopify, the query works correctly, and if i try to put a wrong id in the query in my webapp, the result is (correctly) an error.

Is there something that could prevent the query to be executed? to be complete, i have set the correct permission, the graphql requests are header authenticated and this is the only request i can’t get to work.

Speaking of checkout, is it correct to bypass cart and build a checkout directly (i saw many sites working this way), or is it better to build a cart and then move to checkout?

Thank you

3 Likes

I have the same problem, and they still haven’t fixed it!!!

Using a newly create checkoutId.