Magento 2 How to add products in cart using GraphQL
In this artical we will show you how to add products in the cart for all following types of products using GraphQL.
- Add a simple product to a cart
- Add a configurable product to a cart
- Add a downloadable product to a cart
- Add a bundle product to a cart
- Add a virtual product to a cart
Let's get started!!
Add a simple product to a cart
The addSimpleProductsToCart mutation allows you to add any number of simple products to the cart at the same time. To add simple product to a cart, must be provide the cart ID, the SKU and the quantity. You can optionally provide customizable options.
Syntax:
mutation {
addSimpleProductsToCart(input: AddSimpleProductsToCartInput): {
AddSimpleProductsToCartOutput
}
}
The following example add a simple product to a cart. The response contains the entire contents of the customer's cart.
Request
saveCopyzoom_out_mapmutation {
addSimpleProductsToCart(
input: {
cart_id: "CKqz0w9cbZLhWSKHXk4m5Tz2jOFCbJkv"
cart_items: [{ data: { quantity: 1, sku: "24-MB04" } }]
}
) {
cart {
items {
id
product {
name
sku
}
quantity
}
}
}
}
Response
saveCopyzoom_out_map{
"data": {
"addSimpleProductsToCart": {
"cart": {
"items": [
{
"id": "5",
"product": {
"name": "Sparta Gym Tank",
"sku": "MT08"
},
"quantity": 1
},
{
"id": "7",
"product": {
"name": "Strive Shoulder Pack",
"sku": "24-MB04"
},
"quantity": 4
}
]
}
}
}
}
Add a simple product with customizable options to a cart
If a product has a customizable option, you can specify the option's value in the addSimpleProductsToCart request.
Request
saveCopyzoom_out_mapmutation {
addSimpleProductsToCart(
input: {
cart_id: "6rf8OAO7kLjMHSvmtuUD2tZDRtSWuXMa"
cart_items: [{
data: { quantity: 1, sku: "24-MB04" }
customizable_options: [
{
id: 2
value_string: "4"
}
]
}]
}
) {
cart {
items {
id
product {
name
sku
}
quantity
}
}
}
}
Response
saveCopyzoom_out_map{
"data": {
"addSimpleProductsToCart": {
"cart": {
"items": [
{
"id": "30",
"product": {
"name": "Strive Shoulder Pack",
"sku": "24-MB04"
},
"quantity": 1
}
]
}
}
}
}
Add a configurable product to a cart
Use the addConfigurableProductsToCart mutation to add configurable products to a specific cart.
Syntax
mutation {
addConfigurableProductsToCart(
input: AddConfigurableProductsToCartInput
) {
AddConfigurableProductsToCartOutput
}
}
The following example add simple product with configuration options to the specified shopping cart. The cart_id used in this example was generated by creating an empty cart.
Request
saveCopyzoom_out_mapmutation {
addConfigurableProductsToCart(
input: {
cart_id: "SUAzreA0RsakaL5YcNC2rmgYjfscCZZC"
cart_items: [{
parent_sku: "WJ07"
data: {
quantity: 2,
sku: "WJ07-XS-Purple"
}
}]
}
) {
cart {
items {
id
product {
name
sku
options_container
}
quantity
... on ConfigurableCartItem{
configurable_options{
id
option_label
value_label
value_id
}
}
}
}
}
}
Response
saveCopyzoom_out_map{
"data": {
"addConfigurableProductsToCart": {
"cart": {
"items": [
{
"id": "26",
"product": {
"name": "Inez Full Zip Jacket",
"sku": "WJ07",
"options_container": "container2"
},
"quantity": 2,
"configurable_options": [
{
"id": 93,
"option_label": "Color",
"value_label": "Purple",
"value_id": 5484
},
{
"id": 144,
"option_label": "Size",
"value_label": "XS",
"value_id": 5593
}
]
}
]
}
}
}
}
Add a downloadable product to a cart
A downloadable product can be anything that you can deliver as a file, such as an eBook, music, video, software application, or an update. Use the addDownloadableProductsToCart mutation to add downloadable product to a cart, we must provide the cart ID, the SKU, and the quantity. Some cases, we must include the IDs for downloadable product links, We can also optionally specify customizable options.
Syntax
mutation {
addDownloadableProductsToCart(
input: AddDownloadableProductsToCartInput
) {
AddDownloadableProductsToCartOutput
}
}
The following example how to add downloadable product to shopping cart. depending on whether the Links can be purchased separately option is selected on the Downloadable Information section of the product page.
The following example shows how to add a downloadable product in which the Links can be purchased separately option is enabled.
Request
saveCopyzoom_out_mapmutation {
addDownloadableProductsToCart(
input: {
cart_id: "SUAzreA0RsakaL5YcNC2rmgYjfscCZZC"
cart_items: {
data: {
sku: "240-LV09"
quantity: 1
}
downloadable_product_links: [
{
link_id: 7 # Episode 2
}
{
link_id: 8 # Episode 3
}
]
}
}
) {
cart {
items {
product {
id
sku
name
}
quantity
... on DownloadableCartItem {
links {
title
price
}
samples {
title
sample_url
}
}
}
}
}
}
Response
saveCopyzoom_out_map{
"data": {
"addDownloadableProductsToCart": {
"cart": {
"items": [
{
"product": {
"id": 1306,
"sku": "WJ07",
"name": "Inez Full Zip Jacket"
},
"quantity": 2
},
{
"product": {
"id": 52,
"sku": "240-LV09",
"name": "Luma Yoga For Life"
},
"quantity": 2,
"links": [
{
"title": "Episode 2",
"price": 9
},
{
"title": "Episode 3",
"price": 9
}
],
"samples": [
{
"title": "Trailer #1",
"sample_url": "https://domain.com/downloadable/download/sample/sample_id/16/"
},
{
"title": "Trailer #2",
"sample_url": "https://domain.com/downloadable/download/sample/sample_id/17/"
},
{
"title": "Trailer #3",
"sample_url": "https://domain.com/downloadable/download/sample/sample_id/18/"
}
]
}
]
}
}
}
}
Add a bundle product to a cart
Use the addBundleProductsToCart mutation to add bundle products to a specific cart.
Syntax
mutation {
addBundleProductsToCart(
input: AddBundleProductsToCartInput
) {
AddBundleProductsToCartOutput
}
}
This example adds one bundle product with following children to the specified shopping cart
Request
saveCopyzoom_out_mapmutation {
addBundleProductsToCart(
input: {
cart_id: "SUAzreA0RsakaL5YcNC2rmgYjfscCZZC"
cart_items: [
{
data: {
sku: "24-WG080"
quantity: 1
}
bundle_options: [
{
id: 1
quantity: 1
value: [
"2"
]
},
{
id: 2
quantity: 2
value: [
"4"
]
},
{
id: 3
quantity: 1
value: [
"7"
]
},
{
id: 4
quantity: 1
value: [
"8"
]
}
]
},
]
}) {
cart {
items {
id
quantity
product {
sku
name
}
... on BundleCartItem {
bundle_options {
id
label
type
values {
id
label
price
quantity
}
}
}
}
}
}
}
Response
saveCopyzoom_out_map{
"data": {
"addBundleProductsToCart": {
"cart": {
"items": [
{
"id": "26",
"quantity": 2,
"product": {
"sku": "WJ07",
"name": "Inez Full Zip Jacket"
}
},
{
"id": "29",
"quantity": 1,
"product": {
"sku": "24-WG080",
"name": "Sprite Yoga Companion Kit"
},
"bundle_options": [
{
"id": 1,
"label": "Sprite Stasis Ball",
"type": "radio",
"values": [
{
"id": 2,
"label": "Sprite Stasis Ball 65 cm",
"price": 27,
"quantity": 1
}
]
},
{
"id": 2,
"label": "Sprite Foam Yoga Brick",
"type": "radio",
"values": [
{
"id": 4,
"label": "Sprite Foam Yoga Brick",
"price": 5,
"quantity": 2
}
]
},
{
"id": 3,
"label": "Sprite Yoga Strap",
"type": "radio",
"values": [
{
"id": 7,
"label": "Sprite Yoga Strap 10 foot",
"price": 21,
"quantity": 1
}
]
},
{
"id": 4,
"label": "Sprite Foam Roller",
"type": "radio",
"values": [
{
"id": 8,
"label": "Sprite Foam Roller",
"price": 19,
"quantity": 1
}
]
}
]
}
]
}
}
}
}
Add a virtual product to a cart
We all know that the virtual product represents a saleable item and it is not physical. Virtual products do not need to be shipped or downloaded, or do not they require stock management.
The addVirtualProductsToCart mutation allows you to add multiple virtual products to the cart at the same time, but you cannot add other product types with this mutation. To add a virtual product to a cart, you must provide the cart ID, the SKU, and the quantity. You can also optionally provide customizable options.
Syntax
mutation {
addVirtualProductsToCart(
input: AddVirtualProductsToCartInput
) {
AddVirtualProductsToCartOutput
}
}
The following example returns added virtual product in cart.
Request
saveCopyzoom_out_mapmutation {
addVirtualProductsToCart(
input: {
cart_id: "SUAzreA0RsakaL5YcNC2rmgYjfscCZZC",
cart_items: [
{
data: {
quantity: 1
sku: "001-gold"
}
}
]
}
) {
cart {
items {
product {
name
sku
}
quantity
}
prices {
grand_total {
value
currency
}
}
}
}
}
Response
saveCopyzoom_out_map{
"data": {
"addVirtualProductsToCart": {
"cart": {
"items": [
{
"product": {
"name": "Gold Virtual",
"sku": "001-gold"
},
"quantity": 1
}
],
"prices": {
"grand_total": {
"value": 107.17,
"currency": "USD"
}
}
}
}
}
}
That's it!!
If you are looking for more GraphQL solutions then check out our another article which is List of GraphQL Queries and Mutations for Magento 2.
I hope this article helps you to find what you were looking for.
Bookmark it for your future reference. Do comment below if you have any other questions on that.
P.S. Do share this article with your team.