Initiate New Payment (Redirect)
Overview
The Redirect Integration option for initiating a new payment involves the redirection of the customer to the PXP Financial Hosted Payment Pages from the merchant web site. The merchant application needs to call the PaymentService API to get the redirection URL and any POST data, and additionally will need to process notifications or invoke API methods for checking the payment status afterwards.
The basic steps are:
- Call getRedirectData
- Redirect customer
- Process PaymentStateChangedNotification from PXP Financial
- Once the customer is redirected back to the merchant's web site, display success page
PXP Financial Hosted Payment Pages consist of 2 main pages to which the customer can be redirected:
- Payment Method Selection Page - displays a list of available payment methods to choose from
- Payment Method Detail Page - displays the form with data to be entered for a specific payment method, e.g. card number, holder name, expiration date for Card Deposit.
Payment Initiation - Selection and Detail Pages hosted by PXP Financial
- Step 1: After ordering a product or service, the customer clicks on the checkout or Pay button at the merchant web page
- Step 2: The merchant system calls PaymentService
getRedirectDataRequestto get a URL to redirect the customer.
In addition to getting redirect data for the Payment Method Selection Page (see Quick Start (Redirect)) it is also possible to get it directly for the Payment Method Detail Page:
Example getRedirectDataRequest for redirecting the customer directly to the PXP Financial Payment Method Details Page for a specific payment method - in this case Visa Deposit (2):
<getRedirectDataRequest xmlns="http://www.cqrpayments.com/PaymentProcessing"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns:xsd="http://www.w3.org/2001/XMLSchema">
<merchantID>KalixaAcceptDEMO</merchantID>
<redirectParameters xsi:type="paymentMethodDetailsRedirectParameters">
<shopID>KalixaAcceptDEMO</shopID>
<httpMethod>POST</httpMethod>
<returnUrl>http://www.merchantwebsite.com/Return?orderID=10203040</returnUrl>
<languageCode>EN</languageCode>
<currencyCode>GBP</currencyCode>
<countryCode>GB</countryCode>
<additionalDetails>
<detail xsi:type="keyStringValuePair">
<key>SkinID</key>
<value>06c46a30-f882-4ba9-b9d2-628ea5aa617d</value>
</detail>
<detail xsi:type="keyStringValuePair">
<key>Description</key>
<value>Order Description</value>
</detail>
</additionalDetails>
<user>
<id>KalixaTestUser_3</id>
<username>johndoe</username>
<firstname>John</firstname>
<lastname >Doe</lastname>
<currencyCode>EUR</currencyCode>
<languageCode>EN</languageCode>
<email>[email protected]</email>
<address>
<street>Lombardia</street>
<houseNumber>88</houseNumber>
<postalCode>9999</postalCode>
<countryCode2>AT</countryCode2>
<telephoneNumber>00437778889999</telephoneNumber>
</address>
<dateOfBirth>1995-10-10T00:00:00</dateOfBirth>
<gender>Female</gender>
</user>
<merchantTransactionID>20141211_2</merchantTransactionID>
<grossAmount>33.00</grossAmount>
<expirationTimeSpanInSeconds>900</expirationTimeSpanInSeconds>
<successUrl>http://www.merchantwebsite.com/success?orderID=10203040</successUrl>
<pendingUrl>http://www.merchantwebsite.com/pending?orderID=10203040</pendingUrl>
<errorUrl>http://www.merchantwebsite.com/error?orderID=10203040</errorUrl>
<cancelUrl>http://www.merchantwebsite.com/cancel?orderID=10203040</cancelUrl>
<refusedUrl>http://www.merchantwebsite.com/refused?orderID=10203040</refusedUrl>
<paymentMethodID>2</paymentMethodID>
<isPaymentMethodChangeAllowed>false</isPaymentMethodChangeAllowed>
</redirectParameters>
</getRedirectDataRequest>
- Step 3: PaymentService sends the URL through
getRedirectDataResponse
Regardless of whether getRedirectData was called for the Payment Method Selection Page or for Payment Method Details Page, the response has the same format:
Example getRedirectDataResponse:
<?xml version="1.0" encoding="utf-8"?>
<getRedirectDataResponse xmlns="http://www.cqrpayments.com/PaymentProcessing"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns:xsd="http://www.w3.org/2001/XMLSchema">
<redirectData xsi:type="redirectDataWithPost">
<redirectUrl>https://payments.test.kalixa.com/checkout/paymentmethods</redirectUrl>
<dataFields>
<dataField>
<key>requestData</key>
<value>/sbBHqpQGcBIGiLu2egGhAs0tFYZC5nKPu3kF5xVxav……P3XKbLnEIIKmFyed8aHk3LmxRRW46X0nAF/Xb4Wmg==</value>
</dataField>
</dataFields>
</redirectData>
</getRedirectDataResponse>
- Steps 4,5,6: The merchant system initiates the redirection to PXP Financial Payment Selection Page
After retrieving the redirect data the user should be redirected from the merchant-hosted CheckOut page to the PXP Financial-hosted Payment Pages by using a POST HTTPs request. The redirection URL and the single POST field are taken from the getRedirectDataResponse. The POST field is created in the following way:
Example of executing the redirection with the POST HTTPs method, using the response data above:
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8"/>
</head>
<body>
<form name="input" action="https://payments.test.kalixa.com/checkout/paymentmethods" method="post">
<input type="text" name="requestData" value="/sbBHqpQGcBIGiLu2egGhAs0tFYZC5nKPu3kF5xVxav……P3XKbLnEIIKmFyed8aHk3LmxRRW46X0nAF/Xb4Wmg=="/>
<input type="submit" value="Submit"/>
</form>
</body>
</html>
- Step 7: The customer selects the preferred payment option
- Steps 8,9,10: The customer inserts payment details e.g. credit card number and clicks on Pay button
- Step 11: PaymentService will process the request
Benefits for Merchant
The benefit of this option is that PXP Financial maintains the security, design, content, and updates of the pages.
Payment Initiation - Selection Page hosted by the merchant and Detail Page hosted by PXP Financial
| Step | Description |
|---|---|
| 1 | After ordering a product or service, the customer clicks on the checkout or Pay button at the merchant web page |
| 2 | The merchant displays the Payment Selection Page |
| 3 | The customer selects the payment method |
| 4 | The merchant system calls PXP Financial PaymentService through getRedirectDataRequest to get a URL to redirect the customer |
| 5 | PaymentService sends the URL through getRedirectDataResponse |
| 6,7,8 | The merchant system initiates the redirection to PXP Financial's Payment Detail Page |
| 9 | The customer inserts payment details e.g. credit card number and clicks on Pay button |
| 10 | PaymentService will process the request |
Responsibility split
While the merchant has to maintain the Selection Page, PXP Financial has the responsibility for the Detail Page where the sensitive data is entered securely.
Redirection back to the merchant's result pages
The customer enters the payment account data on the PXP Financial Payment Method Detail Page, and/or gets redirected further to the website of a payment provider, where the customer authenticates her/himself and confirms the transaction.
The following diagram describes the next steps after the transaction processing at PXP Financial and the payment provider has taken place:
- Step 11: Notification with payment result
After a payment is processed, PaymentService sends a handlePaymentStateChangedNotificationRequest to the merchant.
For more information see Process Notifications
Updated almost 3 years ago