In this tutorial, you'll understand how to use Rye's cart API to create a cart, add products to it, and submit it for checkout.


Step 1: Initialize GQL client with your API key

Use your API Key to initialize authorization headers for your GQL client.

Step 2: Add external product to Rye inventory

Adding product data to inventory may take a few seconds, but the product id will be returned immediately. You can then use this product id to fetch product data in the next step.
You can also do this via the Rye Console.

Step 3: Fetch product data from Rye inventory

The product ID can be found in the response to the requestProduct mutation.

Step 4: Create a cart

Create your first cart! We don't require adding a product for the cart to be created if you'd like to create an empty cart.

Step 5: Add more products to your cart

Add more products to your cart with the productIDs and the cartID for the cart that you'd like to add your products to.

Step 6: Verify your cart details

Check if your cart looks good and has the products you have added to it.

Step 7: Update buyer identity

Update buyer identity information if it was not provided during cart creation as it is required to be able to submit the cart.

Step 8: Submit your cart

Submit your cart via rye-pay and Spreedly iFrame.

Step 9: Display the results of the transaction

The result of theryePay.submit should return the cart data and any possible errors that occurred during the submission of the cart. Errors can occur on the Cart level and the Store level:

  • For the cart level: result.errors will provide an array of errors related to submitting the cart with appropriate error messages and codes
  • For the store level: result.cart.stores[idx].errorswill provide an array of errors related to submitting the order to the store with appropriate error messages and codes

(Optional) Step 10: Cart management

  • To update the number of existing products in the cart, use the updateCartItems mutation.
  • To remove existing products from the cart, use the deleteCartItems mutation.
  • To remove the entire cart, use the removeCart mutation.

Next steps