> ## Documentation Index
> Fetch the complete documentation index at: https://docs.waffo.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# Checkout Flow

> How your customers complete purchases

## Checkout Overview

Waffo Pancake uses a **two-step checkout flow** optimized for conversion. This design collects customer details first, then payment information, reducing abandonment and supporting accurate tax calculation.

## Two Ways to Check Out

Waffo Pancake supports two checkout methods — choose the one that fits your use case:

<CardGroup cols={2}>
  <Card title="Product Purchase Link" icon="link">
    **Permanent link** — never expires, stays valid even when you update the product.

    * Best for: sharing on websites, social media, email
    * No code required
  </Card>

  <Card title="Checkout Session (API)" icon="code">
    **Dynamic link** — created via API with custom parameters.

    * Best for: custom checkout flows, dynamic pricing, metadata
    * 45-minute default TTL (configurable up to 7 days)
  </Card>
</CardGroup>

### Product Purchase Links

Every product gets a permanent purchase link:

```
https://checkout.waffo.ai/{store-slug}/{product-slug}
```

Test mode:

```
https://checkout.waffo.ai/{store-slug}/{product-slug}/test
```

A checkout session is created automatically when the customer opens the link. Just click "Copy Link" in the Dashboard.

### Checkout Sessions (API)

For advanced use cases, create a checkout session via the API:

```bash theme={"system"}
POST /v1/actions/checkout/create-session
```

### Authenticated vs Anonymous Checkout

When creating sessions via the API, you can choose between two modes:

* **Authenticated**: Provide `buyerIdentity` to bind orders to a stable identifier. Pre-fills the checkout form and enables post-purchase self-service.
* **Anonymous**: No identity required. Buyer fills in details manually. Suitable for shared links and template stores.

<Warning>
  Authenticated checkout is strongly recommended when you know the buyer. See [SDK Checkout Modes](/integrate/sdks#checkout-modes) for details.
</Warning>

The resulting checkout URL follows this structure:

```
https://checkout.waffo.ai/{store-slug}/checkout/{sessionId}
```

| Component    | Description                                                                    |
| ------------ | ------------------------------------------------------------------------------ |
| `store-slug` | Your store's unique URL slug                                                   |
| `sessionId`  | Checkout session identifier (default 45-minute TTL, configurable up to 7 days) |

<Note>
  Checkout sessions are generated server-side and lock the product version and price at creation time.
</Note>

## Two-Step Checkout Flow

<Steps>
  <Step title="Consumer Details" icon="user">
    Collect email, country, and billing info for tax calculation and order processing.
  </Step>

  <Step title="Payment" icon="credit-card">
    Enter card details or use Apple Pay / Google Pay to complete payment.
  </Step>
</Steps>

<Frame>
  <img src="https://mintcdn.com/waffo/fAGQ8sa2qycWEk2d/images/checkout/checkout-step1.png?fit=max&auto=format&n=fAGQ8sa2qycWEk2d&q=85&s=e7454a2c64f08d42fe0fa1ac4084b712" alt="Checkout page — Consumer details" width="1440" height="900" data-path="images/checkout/checkout-step1.png" />
</Frame>

***

## Step 1: Consumer Details

The first step collects information needed for tax calculation and order processing.

### Required Fields

| Field         | Purpose                                           |
| ------------- | ------------------------------------------------- |
| Email address | Receipt, account creation, Customer Portal access |
| Country       | Tax jurisdiction determination                    |

### Conditional Fields (Based on Country)

| Field           | When Required                              |
| --------------- | ------------------------------------------ |
| ZIP/Postal Code | US, CA, UK, and most countries             |
| State/Province  | US, CA, AU, IN                             |
| City            | EU countries (for VAT)                     |
| Street Address  | EU countries (full address for compliance) |

### Business Purchase Option

Customers can toggle "I'm purchasing as a business" to provide:

* Business name
* Full billing address
* Tax ID (optional, for VAT exemption)

<Note>
  EU tax compliance requires full address for accurate VAT calculation and invoicing.
</Note>

***

## Step 2: Payment

<Frame>
  <img src="https://mintcdn.com/waffo/YbM_n4_eoBfrCsTT/images/checkout/checkout-step2.png?fit=max&auto=format&n=YbM_n4_eoBfrCsTT&q=85&s=e424a83d42c68d5946214be7f18cbbb7" alt="Checkout — Payment" width="1440" height="900" data-path="images/checkout/checkout-step2.png" />
</Frame>

The second step collects payment information.

### Payment Methods

<CardGroup cols={2}>
  <Card title="Card Payment" icon="credit-card">
    * Card number
    * Expiry date (MM/YY)
    * CVC/CVV
    * Cardholder name
  </Card>

  <Card title="Digital Wallets" icon="wallet">
    * Apple Pay (iOS, Safari)
    * Google Pay (Android, Chrome)
    * One-click with biometric auth
  </Card>
</CardGroup>

### Order Summary

Displayed alongside payment form:

| Element       | Description                     |
| ------------- | ------------------------------- |
| Product name  | What customer is buying         |
| Product image | Visual confirmation             |
| Subtotal      | Product price                   |
| Tax           | Calculated from Step 1 location |
| Total         | Final amount to charge          |

### Terms Agreement

Customer must agree to terms before completing purchase. Links to:

* Terms of Service
* Privacy Policy
* Merchant of Record disclosure

***

## Processing

After payment submission:

1. **Card validation** - Luhn check, expiry, CVC
2. **3D Secure** - Bank verification (if required)
3. **Fraud check** - Risk assessment
4. **Authorization** - Charge to card
5. **Order creation** - Record in system

Customer sees:

* Animated loading indicator
* "Processing your payment" message
* Real-time status updates

***

## Result Pages

### Success Page

On successful payment:

* Order confirmation number
* "Receipt sent to your email" message
* Next steps or access instructions
* Customer Portal link

### Failed Page

On payment failure:

* Clear error explanation
* Suggested action
* Retry button
* Support contact option

***

## Subscription Checkout

For subscription products, additional information displays:

### Billing Preview

| Element           | Example               |
| ----------------- | --------------------- |
| Billing frequency | "Billed monthly"      |
| Recurring amount  | "\$29.00/month"       |
| Next billing date | Calculated from today |

### Trial Information (if enabled)

| Element           | Example               |
| ----------------- | --------------------- |
| Trial duration    | "7-day free trial"    |
| First charge date | Date after trial ends |
| Cancel anytime    | Reassurance message   |

***

## Multi-Language Support

Checkout automatically displays in customer's browser language:

| Language             | Code |
| -------------------- | ---- |
| English              | en   |
| Chinese (Simplified) | zh   |
| Japanese             | ja   |
| Korean               | ko   |
| German               | de   |
| French               | fr   |
| Spanish              | es   |

***

## Test Checkout

Use Test Mode to try the checkout flow without real charges.

### Test Card Numbers

| Card              | Number                | Result   |
| ----------------- | --------------------- | -------- |
| Visa Credit       | `4576 7500 0000 0110` | Success  |
| Mastercard Credit | `2226 9000 0000 0110` | Success  |
| Visa Debit        | `4001 7000 0000 0110` | Success  |
| Mastercard Debit  | `2226 9300 0000 0110` | Success  |
| Visa Credit       | `4576 7500 0000 0220` | Declined |
| Mastercard Credit | `2226 9000 0000 0220` | Declined |

Any future expiry date and any 3-digit CVC will work.

<Note>
  Test mode is indicated by a banner: "Test Mode - No real charges will be made"
</Note>

***

## Error Handling

### Common Payment Errors

| Error         | Cause                            | Customer Action    |
| ------------- | -------------------------------- | ------------------ |
| Card declined | Insufficient funds or bank block | Try different card |
| Invalid card  | Incorrect card number            | Check and re-enter |
| Expired card  | Card past expiration             | Use valid card     |
| CVC mismatch  | Wrong security code              | Re-enter CVC       |
| 3DS failed    | Bank verification failed         | Contact bank       |

### Error Display

Error messages are:

* Clear and actionable
* Non-technical language
* Include helpful next steps
* Do not expose sensitive data

***

## Checkout Security

### Product Purchase Links

* Link is permanent and public — no sensitive data is embedded
* A fresh checkout session is created server-side each time a customer opens the link
* Product version and pricing are resolved at the moment of access

### Checkout Sessions (API)

* Sessions lock the product version and price snapshot at creation time
* Sessions include a cryptographic signature and cannot be tampered with
* Sessions expire after 45 minutes by default (configurable up to 7 days via `expiresInSeconds`)

<Warning>
  Checkout sessions expire after 45 minutes by default. Use `expiresInSeconds` to extend up to 7 days. Customers must start a new session after expiration.
</Warning>

***

## Merchant of Record Notice

At checkout footer, customers see:

> "This order is processed by our online reseller & Merchant of Record, Waffo Pancake, who also handles order-related inquiries and returns."

This disclosure is required for MoR compliance and helps customers understand the payment relationship.

***

## Next Steps

<CardGroup cols={2}>
  <Card title="Payment Methods" icon="credit-card" href="/payments/methods">
    Supported cards and wallets
  </Card>

  <Card title="Customization" icon="palette" href="/features/checkout">
    Brand your checkout experience
  </Card>
</CardGroup>