diff --git a/src/guides/v2.3/graphql/index.md b/src/guides/v2.3/graphql/index.md index 8a8ab7c5318..b4ef57acdbc 100755 --- a/src/guides/v2.3/graphql/index.md +++ b/src/guides/v2.3/graphql/index.md @@ -10,9 +10,9 @@ landing-page: GraphQL Developer's Guide As of Magento 2.3.4, GraphQL provides the following features: -* Support for all product types, payment methods, and shipping methods -* Achieved <.5 sec average response times with 500 concurrent requests -* Redesigned a feature rich layered navigation +- Support for all product types, payment methods, and shipping methods +- Achieved <.5 sec average response times with 500 concurrent requests +- Redesigned a feature rich layered navigation ## Where we're going @@ -20,12 +20,12 @@ The `graphql-ce` Community Engineering repository has been archived. Development For the 2.4.0 and 2.4.1 releases, Magento teams are working toward completing GraphQL coverage for Business to Consumer (B2C) uses cases, with emphasis on the following: -* Reorders -* Inventory Management store pickups -* Order history for logged in customers -* Replace product-specific mutations that add products to a cart with a single mutation that can handle all product types -* Gift wrapping and messages -* Saved payment methods +- Reorders +- Inventory Management store pickups +- Order history for logged in customers +- Replace product-specific mutations that add products to a cart with a single mutation that can handle all product types +- Gift wrapping and messages +- Saved payment methods We also expect to begin adding coverage for B2B scenarios. diff --git a/src/guides/v2.3/graphql/tutorials/checkout/checkout-add-product-to-cart.md b/src/guides/v2.3/graphql/tutorials/checkout/checkout-add-product-to-cart.md index 93197ba1b0a..3c1214e90e7 100644 --- a/src/guides/v2.3/graphql/tutorials/checkout/checkout-add-product-to-cart.md +++ b/src/guides/v2.3/graphql/tutorials/checkout/checkout-add-product-to-cart.md @@ -31,9 +31,11 @@ If you add a product to the shopping cart as a registered customer, be sure to s ## Add a simple product into the shopping cart -`{ CART_ID }` is the unique shopping cart ID from [Step 2. Create empty cart]({{ page.baseurl }}/graphql/tutorials/checkout/checkout-add-product-to-cart.html). +The following mutation adds a simple product into the shopping cart. -The following mutation adds a **simple product** into shopping cart. +Replace `{ CART_ID }` with the unique shopping cart ID from [Step 2. Create empty cart]({{ page.baseurl }}/graphql/tutorials/checkout/checkout-add-product-to-cart.html). + +In this example, we will add the Aim Analog Watch (SKU 24-MG04) from the default Luma catalog to the cart. The SKU identifies the product to be added. **Request:** @@ -46,7 +48,7 @@ mutation { { data: { quantity: 1 - sku: "simple-product" + sku: "24-MG04" } } ] @@ -75,9 +77,9 @@ mutation { "cart": { "items": [ { - "id": "508", + "id": "5", "product": { - "sku": "simple-product", + "sku": "24-MG04", "stock_status": "IN_STOCK" }, "quantity": 1 @@ -91,7 +93,8 @@ mutation { ## Add a virtual product into the shopping cart -The following mutation adds a **virtual product** into shopping cart. +The following mutation adds a virtual product into the shopping cart. +In this example, we add the Beginner's Yoga video downloadable product (SKU 240-LV04). **Request:** @@ -104,7 +107,7 @@ mutation { { data: { quantity: 1 - sku: "virtual-product" + sku: "240-LV04" } } ] @@ -133,9 +136,17 @@ mutation { "cart": { "items": [ { - "id": "509", + "id": "5", "product": { - "sku": "virtual-product", + "sku": "24-MG04", + "stock_status": "IN_STOCK" + }, + "quantity": 1 + }, + { + "id": "6", + "product": { + "sku": "240-LV04", "stock_status": "IN_STOCK" }, "quantity": 1 @@ -147,6 +158,8 @@ mutation { } ``` +The response lists all items currently in the cart, including the just-added video download. + ## Verify this step {#verify-step} 1. Sign in as a customer to the website using the email `john.doe@example.com` and password `b1b2b3l@w+`. diff --git a/src/guides/v2.3/graphql/tutorials/checkout/checkout-billing-address.md b/src/guides/v2.3/graphql/tutorials/checkout/checkout-billing-address.md index 4012e0326ab..57dbc8e4746 100644 --- a/src/guides/v2.3/graphql/tutorials/checkout/checkout-billing-address.md +++ b/src/guides/v2.3/graphql/tutorials/checkout/checkout-billing-address.md @@ -17,21 +17,16 @@ contributor_link: https://www.atwix.com/ {:.bs-callout-tip} You must always set the billing address to place an order. -Use the [setBillingAddressOnCart]({{ page.baseurl }}/graphql/mutations/set-billing-address.html) mutation to set a billing address. You can set the billing address in the following ways: +Use the [setBillingAddressOnCart]({{ page.baseurl }}/graphql/mutations/set-billing-address.html) mutation to set a billing address. -* Add a new billing address -* Add a new billing address and set it as the shipping addresses -* Use an address from the logged-in customer's address book +## Add a billing address to the cart -## Add a new billing address +Similar to the shipping address, add a billing address to the cart. `{ CART_ID }` is the unique shopping cart ID from [Step 2. Create empty cart]({{ page.baseurl }}/graphql/tutorials/checkout/checkout-add-product-to-cart.html). The street address is also different, so we can see that different addresses are being created. -The following mutation adds a new billing address. `{ CART_ID }` is the unique shopping cart ID from [Step 2. Create empty cart]({{ page.baseurl }}/graphql/tutorials/checkout/checkout-add-product-to-cart.html). +Send the customer's authorization token in the `Authorization` parameter of the header. See [Authorization tokens]({{page.baseurl}}/graphql/authorization-tokens.html) for more information. **Request:** -{:.bs-callout .bs-callout-info} -For logged-in customers, send the customer's authorization token in the `Authorization` parameter of the header. See [Authorization tokens]({{page.baseurl}}/graphql/authorization-tokens.html) for more information. - ```graphql mutation { setBillingAddressOnCart( @@ -42,236 +37,15 @@ mutation { firstname: "John" lastname: "Doe" company: "Company Name" - street: ["320 N Crescent Dr", "Beverly Hills"] + street: ["64 Strawberry Dr", "Beverly Hills"] city: "Los Angeles" region: "CA" + region_id: 12 postcode: "90210" country_code: "US" telephone: "123-456-0000" - save_in_address_book: false - } - } - } - ) { - cart { - billing_address { - firstname - lastname - company - street - city - region{ - code - label - } - postcode - telephone - country { - code - label - } - } - } - } -} -``` - -**Response:** - -```json -{ - "data": { - "setBillingAddressOnCart": { - "cart": { - "billing_address": { - "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" - } - } - } - } - } -} -``` - -## Add a new address for billing and shipping - -The following mutation includes the `same_as_shipping` attribute, which allows the same address to be used for billing and shipping. - -**Request:** - -```text -mutation { - setBillingAddressOnCart( - input: { - cart_id: "{ CART_ID }" - billing_address: { - 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 - } - same_as_shipping: true - } - } - ) { - cart { - billing_address { - firstname - lastname - company - street - city - region{ - code - label - } - postcode - telephone - country { - code - label - } - } - shipping_addresses { - firstname - lastname - company - street - city - postcode - telephone - country { - code - label - } - } - } - } -} -``` - -**Response:** - -```json -{ - "data": { - "setBillingAddressOnCart": { - "cart": { - "billing_address": { - "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" - } - }, - "shipping_addresses": [ - { - "firstname": "John", - "lastname": "Doe", - "company": "Company Name", - "street": [ - "320 N Crescent Dr", - "Beverly Hills" - ], - "city": "Los Angeles", - "postcode": "90210", - "telephone": "123-456-0000", - "country": { - "code": "US", - "label": "US" - } - } - ] - } - } - } -} -``` - -## Use an existing customer address - -First, query the customer to return the list of address IDs. - -**Request:** - -```text -query { - customer { - addresses { - id - default_billing - default_shipping - } - } -} -``` - -**Response:** - -```text - "data": { - "customer": { - "addresses": [ - { - "id": 2, - "default_billing": true, - "default_shipping": true + save_in_address_book: 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]({{ page.baseurl }}/graphql/tutorials/checkout/checkout-add-product-to-cart.html). - -**Request:** - -```text -mutation { - setBillingAddressOnCart( - input: { - cart_id: "{ CART_ID }" - billing_address: { - customer_address_id: { CUSTOMER_ADDRESS_ID } } } ) { @@ -310,7 +84,7 @@ mutation { "lastname": "Doe", "company": "Company Name", "street": [ - "320 N Crescent Dr", + "64 Strawberry Dr", "Beverly Hills" ], "city": "Los Angeles", diff --git a/src/guides/v2.3/graphql/tutorials/checkout/checkout-coupon.md b/src/guides/v2.3/graphql/tutorials/checkout/checkout-coupon.md index 58651d7dfbe..0ba6fdc5387 100644 --- a/src/guides/v2.3/graphql/tutorials/checkout/checkout-coupon.md +++ b/src/guides/v2.3/graphql/tutorials/checkout/checkout-coupon.md @@ -20,12 +20,42 @@ Use [applyCouponToCart]({{ page.baseurl }}/graphql/mutations/apply-coupon.html) `{ COUPON_CODE }` is an existing Magento coupon code. It cannot be generated with GraphQL. -**Request:** +## Create a coupon + +Coupons must be generated from the Admin. + +Creating a coupon is described in [Coupon Codes](https://docs.magento.com/user-guide/marketing/price-rules-cart-coupon.html). +For the purpose of this tutorial, create a Cart Price Rule with: + +For **Rule Information**: + +- **Rule Name**: Watch Coupon +- **Active**: Yes +- **Websites**: Main Website +- **Customer Groups**: Select all of them +- **Coupon**: Specific Coupon +- **Coupon Code**: Watch20 +- **Uses per Coupon**: 5 +- **Uses per Customer**: 5 + +For **Actions** + +- **Apply**: Percent of product price discount +- **Discount Amount**: 20 + +Save this rule. +The **Coupon Code** value is the name of the coupon the end user enters. +To verify the coupon works, create an order with a product using guest checkout. +When checking out, enter `Watch20` in the Apply Discount Code field and press the Apply Discount button. +The discount should be applied in the cart. + +When the coupon is set up, we can apply it via GraphQL. Replace the `{ CART_ID }` with your generated ID and replace the `{ COUPON_CODE }` with `Watch20` below. -{:.bs-callout .bs-callout-info} For logged-in customers, send the customer's authorization token in the `Authorization` parameter of the header. See [Authorization tokens]({{page.baseurl}}/graphql/authorization-tokens.html) for more information. -```text +**Request:** + +```graphql mutation { applyCouponToCart( input: { @@ -49,23 +79,32 @@ mutation { "data": { "applyCouponToCart": { "cart": { - "applied_coupons": { - "code": "{ COUPON_CODE }" - } + "applied_coupons": [ + { + "code": "Watch20" + } + ] } } } } ``` +## Verify this step {#verify-step} + +1. Sign in as a customer to the website using the email `john.doe@example.com` and password `b1b2b3l@w+`. + +1. Go to Checkout. + +1. The discount is displayed in the Order Summary block. + +## Remove a coupon + Use [removeCouponFromCart]({{ page.baseurl }}/graphql/mutations/remove-coupon.html) to remove a discount coupon from the shopping cart. **Request:** -{:.bs-callout .bs-callout-info} -For logged-in customers, send the customer's authorization token in the `Authorization` parameter of the header. See [Authorization tokens]({{page.baseurl}}/graphql/authorization-tokens.html) for more information. - -```text +```graphql mutation { removeCouponFromCart(input: { cart_id: "{ CART_ID }" }) { cart { @@ -92,11 +131,3 @@ mutation { } } ``` - -## Verify this step {#verify-step} - -1. Sign in as a customer to the website using the email `john.doe@example.com` and password `b1b2b3l@w+`. - -1. Go to Checkout. - -1. The discount is displayed in the Order Summary block. diff --git a/src/guides/v2.3/graphql/tutorials/checkout/checkout-customer.md b/src/guides/v2.3/graphql/tutorials/checkout/checkout-customer.md index 3789f7092bc..d428f0e0c73 100644 --- a/src/guides/v2.3/graphql/tutorials/checkout/checkout-customer.md +++ b/src/guides/v2.3/graphql/tutorials/checkout/checkout-customer.md @@ -14,7 +14,7 @@ contributor_name: Atwix contributor_link: https://www.atwix.com/ --- -This step creates a customer account and generates an authentication token for that customer. You can skip this step if you want to perform this tutorial as a guest user. +This step creates a customer account and generates an authentication token for that customer. You can skip this step if you want to perform this tutorial as a guest user. ## Create a customer @@ -22,7 +22,7 @@ Use the `createCustomer` mutation to register the new customer account in the st **Request:** -```text +```graphql mutation { createCustomer( input: { @@ -68,7 +68,7 @@ To place an order as a customer, you must obtain an authorization token by calli **Request:** -```text +```graphql mutation { generateCustomerToken(email: "john.doe@example.com", password: "b1b2b3l@w+") { token @@ -88,6 +88,11 @@ mutation { } ``` +## Specify an Authorization header + +To send requests on behalf of the customer, you must supply the generated token as a header in your GraphQL browser. +The name of the header is `Authorization` and the value is `Bearer `. + [Authorization tokens]({{page.baseurl}}/graphql/authorization-tokens.html) describes the mutation further. ## Verify this step {#verify-step} diff --git a/src/guides/v2.3/graphql/tutorials/checkout/checkout-payment-method.md b/src/guides/v2.3/graphql/tutorials/checkout/checkout-payment-method.md index ebba8a0e3a8..8be733dd0d1 100644 --- a/src/guides/v2.3/graphql/tutorials/checkout/checkout-payment-method.md +++ b/src/guides/v2.3/graphql/tutorials/checkout/checkout-payment-method.md @@ -15,18 +15,17 @@ contributor_link: https://www.atwix.com/ --- {:.bs-callout-tip} -You must always set a payment method. +You must always set a payment method for an order. Use the following `cart` query to determine which payment methods which are available for your order. `{ CART_ID }` is the unique shopping cart ID from [Step 2. Create empty cart]({{ page.baseurl }}/graphql/tutorials/checkout/checkout-add-product-to-cart.html). -**Request:** - -{:.bs-callout-info} For logged-in customers, send the customer's authorization token in the `Authorization` parameter of the header. See [Authorization tokens]({{page.baseurl}}/graphql/authorization-tokens.html) for more information. -```text +**Request:** + +```graphql query { cart(cart_id: "{ CART_ID }") { available_payment_methods { @@ -54,21 +53,13 @@ query { } ``` -There are two mutation queries in GraphQl which can be use to set the payment method for your order: - -|Mutation|Description| -|--- |--- | -|`setPaymentMethodOnCart`|Sets the payment method for your order.| -|`setPaymentMethodAndPlaceOrder`| **Deprecated** Sets the payment method and then immediately places your order. In this case ["Step 10. Place the order"]({{ page.baseurl }}/graphql/tutorials/checkout/checkout-place-order.html) can be skipped.| - ### Set payment method on cart {#setPaymentMethodOnCart} Use the `setPaymentMethodOnCart` mutation to set the payment method for your order. The value `checkmo` ("Check / Money order" payment method code) was returned in the query. -**Request:** +Send the customer's authorization token in the `Authorization` parameter of the header. See [Authorization tokens]({{page.baseurl}}/graphql/authorization-tokens.html) for more information. -{: .bs-callout-info} -For logged-in customers, send the customer's authorization token in the `Authorization` parameter of the header. See [Authorization tokens]({{page.baseurl}}/graphql/authorization-tokens.html) for more information. +**Request:** ```graphql mutation { @@ -105,46 +96,6 @@ If the operation is successful, the response contains the code of the selected p } ``` -### Set payment method and place order {#setPaymentMethodAndPlaceOrder} - -Use the `setPaymentMethodAndPlaceOrder` mutation to set the payment method and place the order. - -{:.bs-callout-warning} -The `setPaymentMethodAndPlaceOrder` mutation has been deprecated. - -**Request:** - -```graphql -mutation { - setPaymentMethodAndPlaceOrder(input: { - cart_id: "{ CART_ID }" - payment_method: { - code: "checkmo" - } - }) { - order { - order_id - } - } -} -``` - -**Response:** - -If the operation is successful, the response contains the order ID. - -```json -{ - "data": { - "setPaymentMethodAndPlaceOrder": { - "order": { - "order_id": "000000001" - } - } - } -} -``` - ## Verify this step {#verify-step} 1. Sign in as a customer to the website using the email `john.doe@example.com` and password `b1b2b3l@w+`. diff --git a/src/guides/v2.3/graphql/tutorials/checkout/checkout-place-order.md b/src/guides/v2.3/graphql/tutorials/checkout/checkout-place-order.md index 68fab909f04..c6ed8845b05 100644 --- a/src/guides/v2.3/graphql/tutorials/checkout/checkout-place-order.md +++ b/src/guides/v2.3/graphql/tutorials/checkout/checkout-place-order.md @@ -18,12 +18,11 @@ The `placeOrder` mutation places an order. `{ CART_ID }` is the unique shopping cart ID from [Step 2. Create empty cart]({{ page.baseurl }}/graphql/tutorials/checkout/checkout-add-product-to-cart.html). -**Request:** +Send the customer's authorization token in the `Authorization` parameter of the header. See [Authorization tokens]({{page.baseurl}}/graphql/authorization-tokens.html) for more information. -{:.bs-callout .bs-callout-info} -For logged-in customers, send the customer's authorization token in the `Authorization` parameter of the header. See [Authorization tokens]({{page.baseurl}}/graphql/authorization-tokens.html) for more information. +**Request:** -```text +```graphql mutation { placeOrder(input: {cart_id: "{ CART_ID }"}) { order { @@ -51,4 +50,4 @@ mutation { 1. Sign in as a customer to the website using the email `john.doe@example.com` and password `b1b2b3l@w+`. -1. Go to **My Account** > **My Orders**. The order you created is displayed. The order is also displayed on the Orders grid (**Sales** > **Orders** in the Magento Admin. +1. Go to **My Account** > **My Orders**. The order you created is displayed. The order is also displayed on the Orders grid (**Sales** > **Orders**) in the Magento Admin. diff --git a/src/guides/v2.3/graphql/tutorials/checkout/checkout-quote-email.md b/src/guides/v2.3/graphql/tutorials/checkout/checkout-quote-email.md index b490fe820f3..cd2b14cd9f7 100644 --- a/src/guides/v2.3/graphql/tutorials/checkout/checkout-quote-email.md +++ b/src/guides/v2.3/graphql/tutorials/checkout/checkout-quote-email.md @@ -23,7 +23,7 @@ If you place an order as a guest user, you must set a quote email address. Use t **Request:** -```text +```graphql mutation { setGuestEmailOnCart(input: { cart_id: "{ CART_ID }" diff --git a/src/guides/v2.3/graphql/tutorials/checkout/checkout-shipping-address.md b/src/guides/v2.3/graphql/tutorials/checkout/checkout-shipping-address.md index b8be2d55e21..e74776b3d86 100644 --- a/src/guides/v2.3/graphql/tutorials/checkout/checkout-shipping-address.md +++ b/src/guides/v2.3/graphql/tutorials/checkout/checkout-shipping-address.md @@ -14,37 +14,33 @@ contributor_name: Atwix contributor_link: https://www.atwix.com/ --- -Use the [setShippingAddressesOnCart]({{ page.baseurl }}/graphql/mutations/set-shipping-address.html) mutation to set a shipping address. You can set the shipping address in the following ways: +Use the [setShippingAddressesOnCart]({{ page.baseurl }}/graphql/mutations/set-shipping-address.html) mutation to set a shipping address. -* 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 +## Add shipping address to the cart -## Create a new shipping address +In this step, we use the `setShippingAddressesOnCart` mutation to add a shipping address to the cart. -The following mutation adds a shipping address to the quote. +If using guest checkout, run the following example. -`{ CART_ID }` is the unique shopping cart ID from [Step 2. Create empty cart]({{ page.baseurl }}/graphql/tutorials/checkout/checkout-add-product-to-cart.html). +If using a logged in customer, send the customer's authorization token in the `Authorization` parameter of the header. See [Authorization tokens]({{page.baseurl}}/graphql/authorization-tokens.html) for more information. **Request:** -{:.bs-callout .bs-callout-info} -For logged-in customers, send the customer's authorization token in the `Authorization` parameter of the header. See [Authorization tokens]({{page.baseurl}}/graphql/authorization-tokens.html) for more information. - -```text +```graphql mutation { setShippingAddressesOnCart( input: { - cart_id: "{ CART_ID }" + cart_id: "hD5ac9d7N5539DMVhs5uIzwS04hsD3vy" shipping_addresses: [ { address: { firstname: "John" lastname: "Doe" company: "Company Name" - street: ["320 N Crescent Dr", "Beverly Hills"] + street: ["3320 N Crescent Dr", "Beverly Hills"] city: "Los Angeles" region: "CA" + region_id: 12 postcode: "90210" country_code: "US" telephone: "123-456-0000" @@ -71,6 +67,12 @@ mutation { code label } + available_shipping_methods{ + carrier_code + carrier_title + method_code + method_title + } } } } @@ -92,7 +94,7 @@ mutation { "lastname": "Doe", "company": "Company Name", "street": [ - "320 N Crescent Dr", + "3320 N Crescent Dr", "Beverly Hills" ], "city": "Los Angeles", @@ -105,7 +107,21 @@ mutation { "country": { "code": "US", "label": "US" - } + }, + "available_shipping_methods": [ + { + "carrier_code": "flatrate", + "carrier_title": "Flat Rate", + "method_code": "flatrate", + "method_title": "Fixed" + }, + { + "carrier_code": "tablerate", + "carrier_title": "Best Way", + "method_code": "bestway", + "method_title": "Table Rate" + } + ] } ] } @@ -114,130 +130,9 @@ mutation { } ``` -## Assign the shipping address to be the same as the billing address - -[Add a new address for billing and shipping]({{ page.baseurl }}/graphql/tutorials/checkout/checkout-billing-address.html) shows how to do this. - -## Use the existing customer's address - -First, query the customer to return a list of address IDs. - -**Request:** - -```text -query { - customer { - addresses { - id - default_billing - default_shipping - } - } -} -``` - -**Response:** - -```text -{ - "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]({{ page.baseurl }}/graphql/tutorials/checkout/checkout-add-product-to-cart.html). -**Request:** - -```text -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:** - -```json -{ - "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" - } - } - ] - } - } - } -} -``` +Note the `available_shipping_methods` in the response. We will use this information in a later step. ## Verify this step {#verify-step} diff --git a/src/guides/v2.3/graphql/tutorials/checkout/checkout-shopping-cart.md b/src/guides/v2.3/graphql/tutorials/checkout/checkout-shopping-cart.md index c1b7e1cc3cc..5b15be9627b 100644 --- a/src/guides/v2.3/graphql/tutorials/checkout/checkout-shopping-cart.md +++ b/src/guides/v2.3/graphql/tutorials/checkout/checkout-shopping-cart.md @@ -13,7 +13,6 @@ functional_areas: contributor_name: Atwix contributor_link: https://www.atwix.com/ --- - The procedure for creating a cart varies for logged-in customers and guests. The `customerCart` query returns the active cart for the logged-in customer. If the cart does not exist, the query creates one. You must specify the customer’s authorization token in the headers. Otherwise, the query fails. ["Get customer authorization token"]({{ page.baseurl }}/graphql/authorization-tokens.html) describes these tokens. @@ -47,6 +46,7 @@ The customer created in the previous step does not have an active cart. The foll ``` In the subsequent tutorial steps, the unique shopping cart identifier `pXVxnNg4PFcK1lD60O5evqF7f4SkiRR1` will be listed as `{ CART_ID }`. +Copy the value of the id attribute. Use this value in subsequent steps wherever the { CART_ID } variable is specified. ## Create a guest cart @@ -71,6 +71,7 @@ mutation { ``` In the subsequent tutorial steps, the unique shopping cart identifier `A7jCcOmUjjCh7MxDIzu1SeqdqETqEa5h` will be listed as `{ CART_ID }`. +Copy the value of the id attribute. Use this value in subsequent steps wherever the { CART_ID } variable is specified. ## Verify this step {#verify-step} diff --git a/src/guides/v2.3/graphql/tutorials/checkout/index.md b/src/guides/v2.3/graphql/tutorials/checkout/index.md index 3a809e060c8..0503f6be8b2 100644 --- a/src/guides/v2.3/graphql/tutorials/checkout/index.md +++ b/src/guides/v2.3/graphql/tutorials/checkout/index.md @@ -16,31 +16,30 @@ contributor_link: https://www.atwix.com/ This tutorial describes how to place an order through GraphQl. Customers can make purchases in two ways: -* As a logged-in user -* As a guest user who does not create an account +- As a logged-in user +- As a guest user who does not create an account The **10-step tutorial** generally takes **30 minutes**. -The checkout process in GraphQl consists of 10 steps. Magento GraphQL is designed to run queries and perform actions on behalf of a customer. Magento GraphQL does not perform backend tasks, such as manage invoices or shipments. +Magento GraphQL is designed to run queries and perform actions on behalf of a customer. Magento GraphQL does not perform backend tasks, such as manage invoices or shipments. ### Before you begin Complete the following prerequisites: -* Install a Magento 2.3.2 instance with sample data. +- Install a Magento 2 instance with sample data. + The sample data defines a functional store, called Luma, that sells fitness clothing and accessories. The store does not provide any sandbox accounts for testing credit card payments, so transactions will be simulated using an offline [payment method](https://glossary.magento.com/payment-method). - The sample data defines a functional store, called Luma, that sells fitness clothing and accessories. The store does not provide any sandbox accounts for testing credit card payments, so transactions will be simulated using an offline [payment method](https://glossary.magento.com/payment-method). +- Install a GraphQl client. You can use any GraphQl client to send calls to Magento. [Altair](https://altair.sirmuel.design/) is a good example. -* Install a GraphQl client. You can use any GraphQl client to send calls to Magento. [GraphiQL](https://electronjs.org/apps/graphiql) is recommended. +- Learn about GraphQL, how it works, and how to use it. See [Introduction to GraphQL](https://graphql.org/learn/) for details. -* Learn about GraphQL, how it works, and how to use it. See [Introduction to GraphQL](https://graphql.org/learn/) for details. +- Know how to generate a customer token. See [Authorization tokens]({{page.baseurl}}/graphql/authorization-tokens.html) for details. -* Know how to generate a customer token. See [Authorization tokens]({{page.baseurl}}/graphql/authorization-tokens.html) for details. - -* Find the Magento Merchant documentation. Refer to [Getting Started with {{site.data.var.ce}}](http://docs.magento.com/m2/ce/user_guide/getting-started.html) for information about the Luma store that is created when you install Magento with the sample data. +- In the Magento admin, create a [coupon](https://docs.magento.com/user-guide/marketing/price-rules-cart-coupon-code-configure.html) that will be used in [Step 7. Apply a coupon]({{page.baseurl}}/graphql/tutorials/checkout/checkout-coupon.html). ### Other resources -* [Order processing tutorial]({{ page.baseurl }}/rest/tutorials/orders/order-intro.html) shows a system integrator how REST APIs are used in the lifecycle of an order, including configuring a store and creating a customer; creating quotes, orders, invoices, and shipments; preparing for checkout; and more order-related tasks. +- [Order processing tutorial]({{ page.baseurl }}/rest/tutorials/orders/order-intro.html) shows a system integrator how REST APIs are used in the lifecycle of an order, including configuring a store and creating a customer; creating quotes, orders, invoices, and shipments; preparing for checkout; and more order-related tasks. -* [REST Tutorials]({{ page.baseurl }}/rest/tutorials/index.html) provides additional information about completing any Magento REST tutorial. +- [REST Tutorials]({{ page.baseurl }}/rest/tutorials/index.html) provides additional information about completing any Magento REST tutorial. diff --git a/src/guides/v2.4/graphql/tutorials/checkout/checkout-shipping-method.md b/src/guides/v2.4/graphql/tutorials/checkout/checkout-shipping-method.md index 881020119eb..41a29eff096 100644 --- a/src/guides/v2.4/graphql/tutorials/checkout/checkout-shipping-method.md +++ b/src/guides/v2.4/graphql/tutorials/checkout/checkout-shipping-method.md @@ -22,21 +22,22 @@ The `setShippingMethodsOnCart` mutation defines the delivery methods for your or `{ CART_ID }` is the unique shopping cart ID from [Step 2. Create empty cart]({{ page.baseurl }}/graphql/tutorials/checkout/checkout-add-product-to-cart.html). -{:.bs-callout .bs-callout-info} +The `carrier_code` and `method_code` values come from the response of the `setShippingAddressesOnCart` mutation on the [Set the shipping address](checkout-shipping-address.html) step. + For logged-in customers, send the customer's authorization token in the `Authorization` parameter of the header. See [Authorization tokens]({{page.baseurl}}/graphql/authorization-tokens.html) for more information. **Request:** -The following mutation query assigns UPS "Ground" method. +The following mutation assigns Table Rate method. -```text +```graphql mutation { setShippingMethodsOnCart(input: { cart_id: "{ CART_ID }" shipping_methods: [ { - carrier_code: "ups" - method_code: "GND" + carrier_code: "tablerate" + method_code: "bestway" } ] }) { @@ -64,10 +65,10 @@ mutation { "shipping_addresses": [ { "selected_shipping_method": { - "carrier_code": "ups", - "method_code": "GND", - "carrier_title": "United Parcel Service", - "method_title": "Ground" + "carrier_code": "tablerate", + "method_code": "bestway", + "carrier_title": "Best Way", + "method_title": "Table Rate" } } ]