Reading list Switch to dark mode

    How to add products to cart using GraphQL

    Updated 3 April 2024

    In this article, we will learn about how to add products to the cart using GraphQL.

    To add a product in Magento 2 using GraphQL, first, ensure you have the necessary GraphQL endpoint and authentication tokens.

    GraphQL Endpoint: BASE_URL/graphql
    Example: http://example.com/graphql

    Step 1: Create an empty cart.

    First off, we need to create an empty cart to add products in Magento 2 .

    We have created an empty cart for the guest user using the following mutation, token is not required for the guest user.

    Searching for an experienced
    Magento 2 Company ?
    Find out More
    upGrap

    Request:

    mutation {
      createEmptyCart
    }

    Response:

    {
        "data": {
            "createEmptyCart": "HGtFTrWohKAg9o9uXL8HRzl9JCIp8btn"
        }
    }

    This mutation creates an empty cart for the guest user. The unique shopping cart_id: HGtFTrWohKAg9o9uXL8HRzl9JCIp8btn.

    Step 2: Add a simple product.

    The following mutation adds a simple product to the shopping cart.

    We will add the simple product “Test (test)” to the cart. The SKU identifies the product to be added.

    Request:

    mutation {
      addSimpleProductsToCart(
        input: {
          cart_id: "HGtFTrWohKAg9o9uXL8HRzl9JCIp8btn"
          cart_items: [
            {
              data: {
                quantity: 1
                sku: "test"
              }
            }
          ]
        }
      ) {
        cart {
          items {
            id
            product {
              sku
              stock_status
            }
            quantity
          }
        }
      }
    }

    Response:

    {
        "data": {
            "addSimpleProductsToCart": {
                "cart": {
                    "items": [
                        {
                            "id": "484",
                            "product": {
                                "sku": "test",
                                "stock_status": "IN_STOCK"
                            },
                            "quantity": 1
                        }
                    ]
                }
            }
        }
    }

    Execute the mutation through your GraphQL client, and the simple product will be added to your Magento store.

    Step 3: Add a simple product with customizable options.

    The following mutation adds a simple product with customizable options to the shopping cart.

    We will add the simple product with the customizable option “Simple (simple)” to the cart. The SKU identifies the product to be added.

    Request:

    mutation {
      addSimpleProductsToCart(
        input: {
          cart_id: "HGtFTrWohKAg9o9uXL8HRzl9JCIp8btn"
          cart_items: [{
            data: { 
                quantity: 1, 
                sku: "simple" 
            }
            customizable_options: [
              {
                id: 64
                value_string: 128
              }
               
            ]
          }]
        }
      ) {
        cart {
          items {
            id
            product {
              name
              sku
            }
            quantity
          }
        }
      }
    }

    Response:

    {
        "data": {
            "addSimpleProductsToCart": {
                "cart": {
                    "items": [
                        {
                            "id": "484",
                            "product": {
                                "name": "test",
                                "sku": "test"
                            },
                            "quantity": 1
                        },
                        {
                            "id": "485",
                            "product": {
                                "name": "simple",
                                "sku": "simple"
                            },
                            "quantity": 1
                        }
                    ]
                }
            }
        }
    }

    The response lists all items currently in the cart.

    Hope this will help you.

    Thanks ­čÖé

    You can check the following blogs related to GraphQl:
    GraphQl implementation in Magento 2
    GraphQL Mutation

    . . .

    Leave a Comment

    Your email address will not be published. Required fields are marked*


    Be the first to comment.

    Back to Top

    Message Sent!

    If you have more details or questions, you can reply to the received confirmation email.

    Back to Home