# Show Priceless products and enable checkout natively
source: https://developer.mastercard.com/mastercard-benefits-and-experiences-portal/documentation/use-cases/use-cases-5/index.md

## Native Checkout Sequence {#native-checkout-sequence}

This flow picks up at step #12 from the above sequence, after you have shown experiences to your customer, and when the customer clicks to Buy or Book Now in your app. Instead of directing them to Priceless.com, your app facilitates the checkout - sequence shown below:
Diagram use-case-5

1. Customer presses **Buy** or **Book Now**.
2. Your app initiates the checkout flow.
3. Your server requests an order **Estimate** if you have not chosen to skip this step during your partner setup.
   * Feed the estimation endpoint the user's address, number of items, people attending, etc.
   * See the [API Reference](https://developer.mastercard.com/mastercard-benefits-and-experiences-portal/documentation/api-reference/index.md#apis) for `POST /estimates`.
4. The API returns the estimates response in the JSON format.
   * The JSON payload includes an `orderId` - a provisionary order ID which you will need to feed to the endpoint that places the real order.
   * The provisionary estimate orderId is valid for **15 Minutes**.
5. Send the estimate details to your app or service. *NOTE: Steps #5 through #8 are optional when the customer has a default card-on-file*
6. Display the estimate details to the cardholder.
   * Collect the payment instrument.
   * Alternatively, let the user select a previously saved card-on-file.
7. The cardholder must provide the payment information, then press **"Place Order"** or perform a similar action to the same effect.
8. Send the payment information to your server.
9. Calls the order placement endpoint at `POST /orders` from your server.
   * Include parameters that were originally passed to `/estimates` resource
   * Additionally provide payment information (either from the card-on-file, or what was collected from the consumer in your app)
   * You **must** also provide the `orderId` returned from the `/estimates` resource
   * See the [API Reference](https://developer.mastercard.com/mastercard-benefits-and-experiences-portal/documentation/api-reference/index.md#apis) for `POST /orders`
10. API returns order confirmation
    * Final `orderId`, which is different than the `orderId` returned from the `/estimates` resource
    * Order confirmation message in HTML format (within the JSON payload)
11. Send order information to your app
12. Display order confirmation to your customer
13. Co-branded email confirmation with purchase details, attached invoice, etc. is sent to the customer immediately
14. Priceless.com staff and systems take over:
    * Fulfillment staff verify experience/event details and send an Itinerary to the customer
    * Emails are cobranded with your logo and Mastercard's logo

## Sample checkout flow in your app {#sample-checkout-flow-in-your-app}

![Checkout in App](https://static.developer.mastercard.com/content/mastercard-benefits-and-experiences-portal/uploads/api-checkout2.png)

## Sample Request and Response {#sample-request-and-response}

Use your own `partnerId` to make test calls to Sandbox API endpoints.

### 1. Display the product details that you want to offer to the cardholder {#1-display-the-product-details-that-you-want-to-offer-to-the-cardholder}

See [Show Priceless products natively; checkout via a webview on Priceless.com](https://developer.mastercard.com/mastercard-benefits-and-experiences-portal/documentation/use-cases/use-cases-5/index.md) for steps required to obtain product details.

### 2. Request an order estimate (optional) {#2-request-an-order-estimate-optional}

After the cardholder added one or more products to their shopping cart and pressed the checkout button (or performed similar actions as per your app design), make a POST request to receive an estimated price of the order and confirm product availability.
Note: You can skip this step and go straight to checkout. Ask your API integration manager to help you set up your profile.

`POST https://sandbox.api.mastercard.com/the-portal/estimates`

```json
{
  "partnerId": 484,
  "billingAddress": {
    "firstName": "John",
    "lastName": "Doe",
    "addressLine1": "123 Mission Street",
    "city": "Los Angeles",
    "stateName": "California",
    "postalCode": 94109,
    "countryCode": "us",
    "phone": 441132431751
  },
  "shippingAddress": {
    "firstName": "John",
    "lastName": "Doe",
    "addressLine1": "123 Mission Street",
    "city": "Los Angeles",
    "stateName": "California",
    "postalCode": 94109,
    "countryCode": "us",
    "phone": 441132431751
  },
  "items": [
    {
      "productId": 82980,
      "peoplePerItem": 2,
      "quantity": 2
    }
  ]
}
```

```json
{
  "msg": "OK",
  "data": {
    "orderId": 68505,
    "itemPrices": [
      {
        "productId": 82980,
        "peoplePerItem": 2,
        "quantity": 2,
        "sku": "123_1",
        "unitPrice": 7000
      }
    ],
    "tax": 1.5,
    "shippingMethod": "Ground",
    "shippingCost": 0.5,
    "subtotal": 14000,
    "total": 15500,
    "currencyCode": "USD"
  }
}
```

### 3. Place an order {#3-place-an-order}

Pass the interim `orderId` to the `/orders` endpoint to finalize the order placement. If you chose to skip estimates, pass `1`:

`POST https://sandbox.api.mastercard.com/the-portal/orders`

```json
{
  "partnerId": 484,
  "orderId": 68505,
  "emailAddress": "mastercard@priceless.com",
  "preferredLanguageCode": "en-US",
  "items": [
    {
      "productId": 82980,
      "peoplePerItem": 2,
      "quantity": 2
    }
  ],
  "payment": {
    "creditCard": {
      "cardHolderName": "John Doe",
      "cardNumber": 5555000000000000,
      "expirationMonth": 1,
      "expirationYear": 2023,
      "cvv": "037"
    }
  },
  "billingAddress": {
    "firstName": "John",
    "lastName": "Doe",
    "addressLine1": "123 Mission Street",
    "city": "Los Angeles",
    "stateName": "California",
    "postalCode": 94109,
    "countryCode": "us",
    "phone": 441132431751
  },
  "shippingAddress": {
    "firstName": "John",
    "lastName": "Doe",
    "addressLine1": "123 Mission Street",
    "city": "Los Angeles",
    "stateName": "California",
    "postalCode": 94109,
    "countryCode": "us",
    "phone": 441132431751
  }
}
```

```json
{
  "msg": "OK",
  "data": {
    "apiOrderId": 68505,
    "orderId": 87538,
    "nextStep": {
      "products": {
        "82980": "Some text here"
      },
      "faq": "Some text here"
    }
  }
}
```

Keep the `orderId` as this is the ID of the actual order for which the cardholder's card will have been charged.

### 4. Check the order status {#4-check-the-order-status}

If the cardholder wants to check the status of their order, pass `orderId` to this endpoint:

`GET https://sandbox.api.mastercard.com/the-portal/orders/{order_id}/statuses?partner_id=484&order_id=68505`

```json
{
  "msg": "OK",
  "data": {
    "orderStatusId": 22,
    "orderStatusName": "Pending Experience",
    "changeTime": "2021-11-26 20:02:09",
    "orderId": 68505
  }
}
```