Card Payments
The API allows card payments to be made to an existing booking using the following endpoint:
/bookings/{bookingReference}/cardPaymentUrl?amount={amountToPay}
which returns a URL to the TTC Payment Services card payment form, e.g:
https://payment-services.uat.travcorpservices.com/makePayment/TTUSAS/BXXXXXX?cardTypes=VISA,AMEX,ECMC,DISCOVER&postMessage=true&amount=300&bookingType=TA
This URL can be used to render the card payment form within an iFrame, e.g:
<iframe id='paymentServicesForm' class='Payment-iframe' src='https://payment-services.uat.travcorpservices.com/makePayment/TTUSAS/BXXXXXX?cardTypes=VISA,AMEX,ECMC,DISCOVER&postMessage=true&amount=300&bookingType=TA' width='100%' scrolling='no' />
After the card payment form is submitted. TTC Payment Services sends a callback response which is published to the browser as a window event.
Browser-Based Window Event Callback Response
Below is an example of the TTC Payment Services callback response:
{ "paymentSuccessful":"true", "paymentStatus":"SUCCESS", "type":"CyberSourcePaymentResponse", "amountPaid":{"total":"1000","fee":"0"} }
Response Fields
Name | Description |
---|---|
paymentSuccessful | "true" or "false" depending on whether the payment was successfully submitted to the payment provider i.e. CyberSource |
type | determines the response type, currently only set to "CyberSourcePaymentResponse" |
paymentStatus | can be either "SUCCESS" - payment was successfully processed by both the payment provider and TTC downstream systems or "PARTIALLY_COMPLETED" - payment was successfully processed by the payment provider but then failed to update TTC downstream systems |
amountPaid | specifies the amount paid and any fees if applicable |
The following JavaScript code provides an example of how to attach an event listener to the browser window.
It checks the paymentSuccessful boolean flag in the TTC Payment Services response JSON.
The JavaScript function needs to run within the same page which contains the card payment
form embedded as an iFrame.
// function for attaching a TTC Payment Services event listener to the browser window function listenForPaymentServicesPostMessages () { if (window._paymentServicesPostMessageHandler) { window.removeEventListener('message', window._paymentServicesPostMessageHandler, false) } var postMessageHandler = function(event) { return this.paymentServicesResponseReceived(event) } window._paymentServicesPostMessageHandler = postMessageHandler window.addEventListener('message', postMessageHandler, false) } function paymentServicesResponseReceived (event) { // Get TTC Payment Services card payment form URL var paymentFormURL = // i.e. $https://payment-services-domain.com/makePayment/... var origin = event.origin || event.originalEvent.origin if (paymentFormURL.indexOf(origin) !== -1) { var paymentServicesResponse = JSON.parse(event.data) if (paymentServicesResponse.paymentSuccessful === 'true') { // HANDLE THE SUCCESSFUL RESPONSE HERE! } } }
Server-to-Server Callback Response
Below is an example of the TTC Payment Services server-to-server callback response:
{ "status": "success", "amount": "1000", "currency": "USD", "bookingId": "B12345", "sellingCompany": "TTUSAS", "transactionId": "TTUSAS-B12345-1234567", "billingAddress": { "line1": "11 Grosvenor Place", "line2": "", "city": "London", "country": "United Kingdom", "state": "", "postCode": "SW1X 7HH" }, "authToken": "eyJhbGciOiJIUzI1N.eyJzdWIiOiIxMjM0NTY3ODkwIiwibmFtZSI6.SflKxwRJSMeKKF2QT4fwpMeJf36POk6yJV_adQssw5c", }
Response Fields
Name | Description |
---|---|
status | "success" or "failure" depending on whether the payment was successfully processed |
amount | the amount paid and any fees if applicable |
currency | the currency that was used to make the payment |
bookingId | Id of the booking for which payment was made |
sellingCompany | Selling company of the tour |
transactionId | Unique identifier of a payment made for a booking |
billingAddress | Billing address used to make the card payment |
authToken | JWT signature for the response data |
How to verify signature in the card payment server-to-server callback response
We use JWT asymmetric keys mechanism to sign the card payment response sent in the server-to-server callback after a payment is done. The response payload is signed by a private key on the sender end and a public key is used on the receiver end to verify the signature.
In order to verify the signature in the response payload, please use this public key: