Skip to main content

Overview

Openfront supports multiple payment providers including Stripe, PayPal, and manual payments. Payment creation follows a session-based flow where payment sessions are created, initiated, and then completed.

Create Cart Payment Sessions

Initialize payment sessions for all available payment providers in a cart’s region.

GraphQL Mutation

mutation CreateActiveCartPaymentSessions($cartId: ID!) {
  createActiveCartPaymentSessions(cartId: $cartId) {
    id
    paymentCollection {
      id
      amount
      paymentSessions {
        id
        amount
        isSelected
        isInitiated
        paymentProvider {
          id
          code
          name
        }
      }
    }
  }
}
cartId
ID
required
Unique identifier of the cart

Response

id
string
Cart unique identifier
paymentCollection
object
Payment collection containing all payment sessions
id
string
Payment collection ID
amount
number
Total amount to be paid
paymentSessions
array
Array of payment session objects
id
string
Payment session ID
isSelected
boolean
Whether this session is selected for payment
isInitiated
boolean
Whether this session has been initiated
paymentProvider
object
Payment provider details

Example

mutation {
  createActiveCartPaymentSessions(cartId: "cart_123") {
    id
    paymentCollection {
      paymentSessions {
        id
        paymentProvider {
          code
          name
        }
      }
    }
  }
}

Initiate Payment Session

Initiate a specific payment provider’s session and receive payment intent details.

GraphQL Mutation

mutation InitiatePaymentSession(
  $cartId: ID!
  $paymentProviderId: String!
) {
  initiatePaymentSession(
    cartId: $cartId
    paymentProviderId: $paymentProviderId
  ) {
    id
    amount
    data
    isInitiated
    paymentProvider {
      id
      code
    }
  }
}
cartId
ID
required
Cart unique identifier
paymentProviderId
String
required
Payment provider code (e.g., “pp_stripe_stripe”, “pp_paypal_paypal”)

Response

id
string
Payment session ID
amount
number
Payment amount in cents
data
object
Provider-specific payment data
clientSecret
string
Stripe client secret (for Stripe payments)
orderId
string
PayPal order ID (for PayPal payments)
isInitiated
boolean
Payment session initiation status

Example - Stripe

mutation {
  initiatePaymentSession(
    cartId: "cart_123"
    paymentProviderId: "pp_stripe_stripe"
  ) {
    id
    amount
    data
    isInitiated
  }
}

Set Active Cart Payment Session

Select a specific payment session for the cart.

GraphQL Mutation

mutation SetActiveCartPaymentSession(
  $cartId: ID!
  $providerId: ID!
) {
  setActiveCartPaymentSession(
    cartId: $cartId
    providerId: $providerId
  ) {
    id
    paymentCollection {
      paymentSessions {
        id
        isSelected
        paymentProvider {
          code
        }
      }
    }
  }
}
cartId
ID
required
Cart unique identifier
providerId
ID
required
Payment provider ID to select

Create Invoice Payment Sessions

Create payment sessions for an invoice.

GraphQL Mutation

mutation CreateInvoicePaymentSessions($invoiceId: ID!) {
  createInvoicePaymentSessions(invoiceId: $invoiceId) {
    id
    status
    totalAmount
    paymentCollection {
      id
      paymentSessions {
        id
        amount
        paymentProvider {
          id
          code
          name
        }
      }
    }
  }
}
invoiceId
ID
required
Invoice unique identifier

Initiate Invoice Payment Session

Initiate a payment session for an invoice.

GraphQL Mutation

mutation InitiateInvoicePaymentSession(
  $invoiceId: ID!
  $paymentProviderId: String!
) {
  initiateInvoicePaymentSession(
    invoiceId: $invoiceId
    paymentProviderId: $paymentProviderId
  ) {
    id
    amount
    data
    isInitiated
    paymentProvider {
      code
    }
  }
}
invoiceId
ID
required
Invoice unique identifier
paymentProviderId
String
required
Payment provider code

Payment Provider Codes

Openfront supports the following payment provider codes:
pp_stripe_stripe
string
Stripe payment provider
pp_paypal_paypal
string
PayPal payment provider
pp_system_default
string
Manual/Cash on Delivery payment method

Payment Flow

  1. Create payment sessions - Initialize sessions for all available providers
  2. Initiate session - Start the payment flow with a specific provider
  3. Client-side confirmation - Use the provider’s SDK to confirm payment
  4. Complete cart/invoice - Finalize the order and capture payment

Example Complete Flow

# Step 1: Create payment sessions
mutation {
  createActiveCartPaymentSessions(cartId: "cart_123") {
    paymentCollection {
      paymentSessions {
        id
        paymentProvider {
          code
        }
      }
    }
  }
}

# Step 2: Initiate Stripe payment
mutation {
  initiatePaymentSession(
    cartId: "cart_123"
    paymentProviderId: "pp_stripe_stripe"
  ) {
    id
    data # Contains clientSecret for Stripe.js
  }
}

# Step 3: Client confirms with Stripe.js
# (Client-side JavaScript using Stripe SDK)

# Step 4: Complete the cart
mutation {
  completeActiveCart(
    cartId: "cart_123"
    paymentSessionId: "session_456"
  )
}

Direct Payment Creation

Create a payment record directly (requires admin permissions):
mutation CreatePayment($data: PaymentCreateInput!) {
  createPayment(data: $data) {
    id
    status
    amount
    currencyCode
    capturedAt
    order {
      id
      displayId
    }
  }
}
data
PaymentCreateInput
required
Payment data
status
String
required
Payment status (pending, authorized, captured, failed, canceled)
amount
Int
required
Payment amount in cents
currencyCode
String
required
ISO currency code (e.g., “USD”)
order
OrderRelateToOneInput
Associated order
data
JSON
Payment provider data

Build docs developers (and LLMs) love