Enabling punch-out payment

You can enable punch-out payment in starter stores. Punch-out payment is a payment model where a third-party payment service provider processes payments for orders.

Processing payments using third-party payment service providers offers an alternative payment option for customers who prefer to store their payment information with third-party services. Considerations such as credit card authorizations and billing inquiries are handled by the third-party payment service provider. In addition, store owners who do not own a merchant account can still accept credit card transactions during checkout.

There are two ways to connect to the payment service provider:
  • Using a pop-up window to the third-party payment service provider.Order flow with Punchout Payment in pop-up model:
    1. Customer checks out from the shopping cart page
    2. Customer chooses the Punchout payment method and clicks Next.
    3. Customer clicks the Order button.
    4. At the order confirmation page, customer clicks the Pay button, a new pop-up browser window appears to direct the customer to the PSP website.
    5. Customer logs on to the PSP to process payment.
    6. PSP invokes the PunchoutCallBackCmd of Commerce though URL call. Commerce updates the payment status and order status according to the payment processing result.
    Detailed flow for the pop-up model:

    1. Customer submits the order and OrderProcessCmd is invoked.
    2. OrderProcessCmd triggers Plug-in's approveAndDeposit API.
    3. Plug-in returns the status to OrderProcessCmd.
    4. OrderProcessCmd redirect the customer to OrderConfirmation page.
    5. Customer clicks Pay button which caused a new window POPed up to PunchoutPaymentRedirectView.
    6. PunchoutPaymentRedirectView invokes the order service which will subsequently invoke the plug-in's getAuthenticationURL API to get the PSP's authentication URL.
    7. Plugin returns a URL with needed parameters to PunchoutPaymentRedirectView .
    8. PunchoutPaymentRedirectView redirects the customer to this URL.
    9. Customer processes payment on the PSP's website.
    10. After the payment has been processed on the PSP's website, PSP redirects the customer to PunchoutPaymentCallBackCmd with the result of the payment processing.
    11. PunchoutPaymentCallBackCmd invokes the Plug-in's preprocessProviderResponseData API to get the payment instruction ID from the response data.
    12. Plug-in returns the payment instruction Id.
    13. PunchoutPaymentCallBackCmd invokes the Plug-in's processProviderResponse API to process the response.
    14. Plug-in returns the Map of the response parameters with the payment result.
    15. PunchoutPaymentCallBackCmd updates the Payment/Order database according to the payment results.
    16. PunchoutPaymentCallBackCmd redirects the customer to PunchoutPaymentCallBackView.
    17. PunchoutPaymentCallBackView returns the payment result processing result to the PSP.
  • Using a redirect to the third party payment service provider:Order flow with Punchout Payment in Re-direct model:
    1. Customer checks out from the shopping cart page.
    2. Customer chooses the Punchout payment method and clicks Next.
    3. Customer clicks the Order button.
    4. Commerce store redirects the browser to the PSP website.
    5. Customer logs on to the PSP to process payment.
    6. PSP redirects the browser back to the order confirmation page of Commerce store. Commerce updates the payment status and order status according to the payment processing result.

    Detailed flow of the redirect model:

    1. Customer submits the order and OrderProcessCmd is invoked.
    2. OrderProcessCmd triggers Plug-in's approveAndDeposit API.
    3. Plug-in returns the status to OrderProcessCmd.
    4. OrderProcessCmd redirect the customer to PunchoutPaymentRedirectView.
    5. PunchoutPaymentRedirectView invokes the order service which will subsequently invoke the plug-in's getAuthenticationURL API to get the PSP's authentication URL.
    6. Plugin returns a URL with needed parameters to PunchoutPaymentRedirectView .
    7. PunchoutPaymentRedirectView redirects the customer to this URL.
    8. Customer processes payment on the PSP's website.
    9. After the payment has been processed on the PSP's website, PSP redirects the customer to PunchoutPaymentCallBackCmd with the result of the payment processing.
    10. PunchoutPaymentCallBackCmd invokes the Plug-in's preprocessProviderResponseData API to get the payment instruction ID from the response data.
    11. Plug-in returns the payment instruction Id.
    12. PunchoutPaymentCallBackCmd invokes the Plug-in's processProviderResponse API to process the response.
    13. Plug-in returns the Map of the response parameters with the payment result.
    14. PunchoutPaymentCallBackCmd updates the Payment/Order database according to the payment results.
    15. PunchoutPaymentCallBackCmd redirects the customer to PunchoutPaymentCallBackView.
    16. PunchoutPaymentCallBackView returns the payment result processing result to the PSP.
    17. PunchoutPaymentCallBackView redirects the customer to the OrderConfirmation page.
The following tasks enable support for punch-out payments in starter stores using the SimplePunchout plug-in and a punch-out payment service simulator: