Step 4. Set the shipping address
GraphQL checkout tutorial
Use the setShippingAddressesOnCart mutation to set a shipping address. You can set the shipping address in the following ways:
- Add a new shipping address
- Assign the shipping address to be the same as the billing address
- Use an address already defined in the logged-in customer’s address book
Create a new shipping address
The following mutation adds a shipping address to the quote.
{ CART_ID } is the unique shopping cart ID from Step 2. Create empty cart.
Request:
For logged-in customers, send the customer’s authorization token in the Authorization parameter of the header. See Authorization tokens for more information.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
mutation {
setShippingAddressesOnCart(
input: {
cart_id: "{ CART_ID }"
shipping_addresses: [
{
address: {
firstname: "John"
lastname: "Doe"
company: "Company Name"
street: ["320 N Crescent Dr", "Beverly Hills"]
city: "Los Angeles"
region: "CA"
postcode: "90210"
country_code: "US"
telephone: "123-456-0000"
save_in_address_book: false
}
}
]
}
) {
cart {
shipping_addresses {
firstname
lastname
company
street
city
region {
code
label
}
postcode
telephone
country {
code
label
}
}
}
}
}
Response:
setShippingAddressesOnCart returns the new address details.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
{
"data": {
"setShippingAddressesOnCart": {
"cart": {
"shipping_addresses": [
{
"firstname": "John",
"lastname": "Doe",
"company": "Company Name",
"street": [
"320 N Crescent Dr",
"Beverly Hills"
],
"city": "Los Angeles",
"region": {
"code": "CA",
"label": "California"
},
"postcode": "90210",
"telephone": "123-456-0000",
"country": {
"code": "US",
"label": "US"
}
}
]
}
}
}
}
Assign the shipping address to be the same as the billing address
Add a new address for billing and shipping shows how to do this.
Use the existing customer’s address
First, query the customer to return a list of address IDs.
Request:
1
2
3
4
5
6
7
8
9
query {
customer {
addresses {
id
default_billing
default_shipping
}
}
}
Response:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
{
"data": {
"customer": {
"addresses": [
{
"id": 2,
"default_billing": true,
"default_shipping": false
},
{
"id": 3,
"default_billing": false,
"default_shipping": false
},
{
"id": 4,
"default_billing": false,
"default_shipping": true
}
]
}
}
}
Set { CUSTOMER_ADDRESS_ID } to an id returned in the query.
{ CART_ID } is the unique shopping cart ID from Step 2. Create empty cart.
Request:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
mutation {
setShippingAddressesOnCart(
input: {
cart_id: "{ CART_ID }"
shipping_addresses: {
customer_address_id: { CUSTOMER_ADDRESS_ID }
}
}
) {
cart {
shipping_addresses {
firstname
lastname
company
street
city
region {
code
label
}
postcode
telephone
country
{
code
label
}
}
}
}
}
Response:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
{
"data": {
"setShippingAddressesOnCart": {
"cart": {
"shipping_addresses": [
{
"firstname": "John",
"lastname": "Doe",
"company": "Company Name",
"street": [
"320 N Crescent Dr",
"Beverly Hills"
],
"city": "Los Angeles",
"region": {
"code": "CA",
"label": "California"
},
"postcode": "90210",
"telephone": "123-456-0000",
"country": {
"code": "US",
"label": "US"
}
}
]
}
}
}
}
Verify this step
-
Sign in as a customer to the website using the email
john.doe@example.comand passwordb1b2b3l@w+. -
Go to Checkout.
-
On the Shipping step, the Shipping Address form contains the address details you entered.