With the $wsPayPalCheckout module, you can use PayPal payment data dynamically in the frontend. It supports various payment methods such as PayPal Express Checkout, Google Pay, and Apple Pay. In this section, you will learn how to query the payment status and use the payment data for integration.
Module overview
Example / excerpt of $wsPayPalCheckout
{{= $wsPayPalCheckout | json }}
JSON output
{
"integrationDate": "...",
"status": "...",
"paymentCanceled": false,
"paymentFailed": false,
"paymentDeclined": false,
"expressCheckout": false,
"expressCheckoutGooglePay": false,
"expressCheckoutApplePay": false,
"googlePay": {
"paymentData": "...",
"transactionInfo": {
"countryCode": "...",
"currencyCode": "...",
"displayItems": [...],
"totalPrice": "...",
"totalPriceLabel": "...",
"totalPriceStatus": "..."
}
},
"applePay": {
"billingContact": { },
"brandName": "...",
"payLineItems": [...],
"paymentData": "...",
"shippingOptions": [...]
},
"loadData": "ƒ()"
}
Note: ƒ() denotes a function.
Variables and methods overview
| Variable | Return type | Description |
|---|
integrationDate | string | Returns the PayPal Checkout integration date. |
status | string | Returns the current payment status of the session. |
paymentCanceled | bool | Indicates whether the payment was canceled. |
paymentFailed | bool | Indicates whether the payment failed. |
paymentDeclined | bool | Indicates whether the payment was declined. |
expressCheckout | bool | Indicates whether PayPal Express Checkout is possible. |
expressCheckoutGooglePay | bool | Indicates whether Google Pay Express is possible. |
expressCheckoutApplePay | bool | Indicates whether Apple Pay Express is possible. |
googlePay | map | Returns Google Pay specific data. |
applePay | map | Returns Apple Pay specific data. |
loadData() | map | Loads all payment data for PayPal Checkout. |
Templates
The $wsPayPalCheckout module is typically used in the checkout area, in particular on the payment page and the order confirmation. The PayPal buttons can also be embedded on product pages or in the basket for express checkout.
Variables
$wsPayPalCheckout.integrationDate
Returns the integration date of the PayPal connection.
Integration date: {{= $wsPayPalCheckout.integrationDate }}
$wsPayPalCheckout.status
Returns the status of the PayPal payment (empty if no payment process is active).
Status: {{= $wsPayPalCheckout.status }}
$wsPayPalCheckout.paymentCanceled
Returns true if the customer canceled the payment.
{{ if $wsPayPalCheckout.paymentCanceled }}
// Payment was canceled
{{ /if }}
$wsPayPalCheckout.paymentFailed
Returns true if a technical error occurred during the payment.
{{ if $wsPayPalCheckout.paymentFailed }}
// Payment failed
{{ /if }}
$wsPayPalCheckout.paymentDeclined
Returns true if the payment was declined by PayPal or the bank.
{{ if $wsPayPalCheckout.paymentDeclined }}
// Payment was declined
{{ /if }}
$wsPayPalCheckout.expressCheckout
Indicates whether PayPal Express Checkout is possible.
{{ if $wsPayPalCheckout.expressCheckout }}
// Show PayPal Express Checkout
{{ /if }}
$wsPayPalCheckout.expressCheckoutGooglePay
Indicates whether Google Pay Express is possible.
{{ if $wsPayPalCheckout.expressCheckoutGooglePay }}
// Show Google Pay
{{ /if }}
$wsPayPalCheckout.expressCheckoutApplePay
Indicates whether Apple Pay Express is possible.
{{ if $wsPayPalCheckout.expressCheckoutApplePay }}
// Show Apple Pay
{{ /if }}
$wsPayPalCheckout.googlePay
Returns a map with Google Pay specific contents.
Google Pay data: {{= $wsPayPalCheckout.googlePay }}
$wsPayPalCheckout.applePay
Returns a map with Apple Pay specific data.
Apple Pay data: {{= $wsPayPalCheckout.applePay }}
Methods
$wsPayPalCheckout.loadData()
Loads all payment data for PayPal Checkout. Returns null if no active payment process exists.
Signature
$wsPayPalCheckout.loadData(expressCheckout)
Return value
Map - Map with payment data, or null.
Parameters
| Name | Type | Required | Description |
|---|
expressCheckout | bool | no | true additionally loads express checkout data. |
Example that loads the payment data.
{{ var $myPaypalDataVariable = $wsPayPalCheckout.loadData() }}
{{ if $myPaypalDataVariable }}
// Payment data available
{{ /if }}
By using the $wsPayPalCheckout.loadData() function, various variables are available to retrieve and output payment data. Below is an overview of which variables are available.
Payment data (return value of $wsPayPalCheckout.loadData())
First, it is necessary to assign the map with the payment data, as shown in the example above, to a local variable. This can then be used at various places in the template.
JSON output of the variable
{
"sandbox": true/false,
"merchantId": "...",
"payerId": "...",
"clientId": "...",
"paymentType": "paypal",
"languageCode": "...",
"intent": "capture",
"approvalUrl": "...",
"cancelUrl": "...",
"errorUrl": "...",
"expressApprovalUrl": "...",
"getClientToken": "ƒ()",
"orderId": "...",
"googlePay": { ... },
"applePay": { ... }
}
Variables overview
General properties:
| Variable | Type | Description |
|---|
sandbox | bool | Indicates whether sandbox mode (test mode for payment methods) is active. |
merchantId | string | PayPal Merchant ID. |
payerId | string | PayPal Payer ID. |
clientId | string | PayPal Client ID. |
paymentType | string | Payment type (default: “paypal”). |
languageCode | string | Language code. |
approvalUrl | string | URL for the payment confirmation. |
cancelUrl | string | URL on cancellation of the payment. |
errorUrl | string | URL on errors that occurred. |
expressApprovalUrl | string | URL on a successful express payment. |
getClientToken | function | Function that returns the client token for the PayPal SDK integration. |
orderId | string | PayPal Order ID of the current transaction. |
Properties of Google Pay and Apple Pay
Google Pay:
| Variable | Type | Description |
|---|
paymentData | string | Response data from Google Pay (unprocessed). |
transactionInfo | map | Map with transaction info from Google Pay. |
Apple Pay:
| Variable | Type | Description |
|---|
shippingOptions | array | Shipping options. |
billingContact | map | Billing address. |
payLineItems | array | Apple Pay line items. |
brandName | string | Brand name. |
paymentData | string | Response data from Apple Pay (unprocessed). |
Actions
No actions are available for $wsPayPalCheckout.