Example Library Code

Quick Find

Go straight to the section you need.

1.0 Gateway Integration →

1.1 Introduction

1.2 Terminology

1.3 Integration Methods

1.4 Integration Libraries

1.5 Security and Compliance

1.6 Prerequisites

1.7 Integration Details

1.8 Authentication

1.9 Supported Actions

2.0 New Transactions →

2.1 Request Fields

2.2 Response Fields

3.0 Management Requests →

3.1 Request Fields

3.2 Response Fields

4.0 AVS/CV2 Checking →

4.1 Background

4.2 Benefits and Limitations

4.3 Request Fields

4.4 Response Fields

5.0 3-D Secure Authentication →

5.1 Background

5.2 Benefits and Limitations

5.3 Hosted Implementation

5.4 Direct Implementation

5.5 Request Fields

5.6 Response Fields

5.7 Advanced Features

11 Receipts and Notifications →

11.1 Background

11.2 Customer Email Receipts

11.3 Request Fields

11.4 Response Fields

17 Advanced Data →

17.1 Customer Request Fields

17.2 Merchant Request Fields

17.3 Supplier Request Fields

17.4 Delivery Request Fields

17.5 Receiver Request Fields

17.6 Shipping Request Fields

17.7 Device Information Fields

 

19 Gateway Wallet → 

19.1 Background

19.2 Benefits and Limitation

19.3 Hosted

19.4 Direct Implentation

19.5 Request Fields

19.6 Response Fields

 

26 Digital Wallet Transactions →

26.1 Background

26.2 Benefits and Limitations

26.3 Configuration

26.4 Hosted Implementation

26.5 Direct Implementation

26.6 Request Fields

26.7 Response Fields

26.8 Digital Wallet Tokens

Appendix

A-1 Response Codes

A-1.1 Authorisation Response Codes

A-1.2 Gateway Response Codes

A-2 AVS / CV2 Check Response Codes

A-3 3-D Secure Enrolment/Authentication Codes

A-4 3-D Secure Enrolment/Authentication Only

A-9 Duplicate Transaction Checking

A-10 Capture Delay

A-11 Card Identification

A-12 Integration Testing

12.1 Test Amounts

12.2 Test Cards

12.3 3-D Secure Testing

 

A-13 Sample Signature Calculation

A-14 Transaction Life cycle

A-14.1 Authorise, Capture and Settlement

A-14.2 Transaction States

A-15 Transaction types

A-15.1 E-commerce (ECOM)

A-15.2 Mail Order/Telephone Order (MOTO)

A-15.3 Continuous Authority (CA)

 

A-16 Payment Tokenisation

A-16.1 PREAUTH, SALE, REFUND, VERIFY requests

A-16.2 REFUND_SALE requests

A-16.3 CANCEL or CAPTURE requests

A-16.4 QUERY requests

A-16.5 SALE or REFUND Referred Authorisation requests

 

A-18 PSD2 SCA Compliance

A-18.1 Obtaining Strong Customer Authentication

A-18.2 Exemptions to Strong Customer Authentication

A-18.3 SCA Using 3-D Secure

 

A-19 Hosted Payment Page Options

A-20 Integration Libraries

A-20.1 Gateway Integration Library

A-20.2 Hosted Payment Page Library

A-20.3 Hosted Payment Fields Library

 

A-21 Example HTTP Requests

A-21.1 Hosted Integration

A-21.2 Direct Integration

A-21.3 Batch Integration

 

A-22 Example Integration Code

A-22.1 Hosted Integration

A-22.2 Direct Integration

A-22.3 Batch Integration

 

A-23 Example Library Code

A-23.1 Gateway Integration Library

A-23.2 Hosted Payment Page Library

A-23.3 Hosted Payment Fields Library

A-23 Example Library Code

The follow section provides samples of how to integrate with the Gateway using our integration libraries as documented in section A-20.1.

A-23.1 Gateway Integration Library

The following example PHP code shows how to send a SALE transaction using the Gateway library:

 

  1. <?PHP 
  2. require(‘gateway.php’); 
  3. use \P3\SDK\Gateway; 
  4. // Signature key entered on MMS. The demo account is fixed to this value, 
  5. Gateway::$merchantSecret = ‘Circle4Take40Idea’
  6. // Gateway URL 
  7. Gateway::$hostedUrl = ‘https://gateway.swipen.com/hosted/’
  8. if (!isset($_POST[‘responseCode’])) { 
  9. // Send request to gateway 
  10. $req = array
  11. ‘merchantID’ => 100001, 
  12. ‘action’ => ‘SALE’
  13. ‘type’ => 1, 
  14. ‘currencyCode’ => 826, 
  15. ‘countryCode’ => 826, 
  16. ‘amount’ => 1001, 
  17. ‘orderRef’ => ‘Test purchase’
  18. ‘redirectURL’ => ($_SERVER[‘HTTPS’] == ‘on’ ? ‘https’ : ‘http’) . ‘://’ . $_SERVER[‘HTTP_HOST’] . $_SERVER[‘REQUEST_URI’], 
  19. ); 
  20. try { 
  21. echo Gateway::hostedRequest($req); 
  22. } catch (\Exception $e) { 
  23. // You should exit gracefully 
  24. die(‘Sorry, the request could not be sent: ‘ . $e); 
  25. } else
  26. // Received response from gateway 
  27. try { 
  28. Gateway::verifyResponse($_POST); 
  29. } catch(\Exception $e) { 
  30. // You should exit gracefully 
  31. die(‘Sorry, the request could not be sent: ‘ . $e); 
  32. // Check the response code 
  33. if ($_POST[‘responseCode’] === 0) { 
  34. echo “<p>Thank you for your payment.</p>”
  35. } else
  36. echo “<p>Failed to take payment: ” . htmlentities($_POST[‘responseMessage’]) . “</p>”
  37. ?> 

 

 

 

A-23.1.2 Direct Sale Transaction (with 3-D Secure)

 

The following example PHP code shows how to send a SALE transaction with support for 3-D Secure using the Gateway library:

 

  1. <?PHP 
  2. require(‘gateway.php’); 
  3. use \P3\SDK\Gateway; 
  4. // Signature key entered on MMS. The demo account is fixed to this value, 
  5. Gateway::$merchantSecret = ‘Circle4Take40Idea’
  6. // Gateway URL 
  7. Gateway::$directUrl = ‘https://gateway.swipen.com/direct/’
  8. // Setup PHP session as use it to store data between 3DS steps 
  9. if (isset($_GET[‘sid’])) { 
  10. session_id($_GET[‘sid’]); 
  11. session_start(); 
  12. // Compose current page URL (removing any sid and acs parameters) 
  13. $pageUrl = ((isset($_SERVER[‘HTTPS’]) && $_SERVER[‘HTTPS’] == ‘on’) ? ‘https://’ : ‘http://’
  14. . $_SERVER[‘SERVER_NAME’] . ($_SERVER[‘SERVER_PORT’] != ’80’ ? ‘:’ . $_SERVER[‘SERVER_PORT’] :
  15. . preg_replace(‘/(sid=[^&]+&?)|(acs=1&?)/’, , $_SERVER[‘REQUEST_URI’]); 
  16. // Add back the correct sid parameter (used as session cookie may not be passed when the page is redirected from an IFRAME) 
  17. $pageUrl .= (strpos($pageUrl, ‘?’) === false ? ‘?’ : ‘&’) . ‘sid=’ . urlencode(session_id()); 
  18. // If ACS response into the IFRAME then redirect back to parent window 
  19. if (!empty($_GET[‘acs’])) { 
  20. echo silentPost($pageUrl, array(‘threeDSResponse’ => $_POST), ‘_parent’); 
  21. exit(); 
  22. if (!isset($_POST[‘threeDSResponse’])) { 
  23. // Initial request 
  24. // Gather browser info – can be done at any time prior to the checkout 
  25. if (!isset($_POST[‘browserInfo’])) { 
  26. echo Gateway::collectBrowserInfo(); 
  27. exit(); 
  28. // Direct Request 
  29. $req = array
  30. ‘merchantID’ => 100001, 
  31. ‘action’ => ‘SALE’
  32. ‘type’ => 1, 
  33. ‘currencyCode’ => 826, 
  34. ‘countryCode’ => 826, 
  35. ‘amount’ => 1001, 
  36. ‘cardNumber’ => ‘4012001037141112’
  37. ‘cardExpiryMonth’ => 12, 
  38. ‘cardExpiryYear’ => 15, 
  39. ‘cardCVV’ => ‘083’
  40. ‘customerName’ => ‘Test Customer’
  41. ‘customerEmail’ => ‘test@testcustomer.com’
  42. ‘customerAddress’ => ’16 Test Street’
  43. ‘customerPostCode’ => ‘TE15 5ST’
  44. ‘orderRef’ => ‘Test purchase’
  45. // The following fields are mandatory for 3DS v2 
  46. ‘remoteAddress’ => $_SERVER[‘REMOTE_ADDR’], 
  47. ‘threeDSRedirectURL’ => $pageUrl . ‘&acs=1’
  48. ); 
  49. // Add the browser info as it is mandatory for 3DS v2 
  50. $req += $_POST[‘browserInfo’]; 
  51. } else
  52. // 3DS continuation request 
  53. $req = array
  54. // The following field are only required for tbe benefit of the SDK 
  55. ‘merchantID’ => 100001, 
  56. ‘action’ => ‘SALE’
  57. // The following field must be passed to continue the 3DS request 
  58. ‘threeDSRef’ => $_SESSION[‘threeDSRef’], 
  59. ‘threeDSResponse’ => $_POST[‘threeDSResponse’], 
  60. ); 
  61. try { 
  62. $res = Gateway::directRequest($req); 
  63. } catch (\Exception $e) { 
  64. // You should exit gracefully 
  65. die(‘Sorry, the request could not be sent: ‘ . $e); 
  66. // Check the response code 
  67. if ($res[‘responseCode’] === Gateway::RC_3DS_AUTHENTICATION_REQUIRED) { 
  68. // Send request to the ACS server displaying response in an IFRAME 
  69. // Render an IFRAME to show the ACS challenge (hidden for fingerprint method) 
  70. $style = (isset($res[‘threeDSRequest’][‘threeDSMethodData’]) ? ‘display: none;’ : ); 
  71. echo “<iframe name=\”threeds_acs\” style=\”height:420px; width:420px; {$style}\”></iframe>\n”
  72. // Silently POST the 3DS request to the ACS in the IFRAME 
  73. echo silentPost($res[‘threeDSURL’], $res[‘threeDSRequest’], ‘threeds_acs’); 
  74. // Remember the threeDSRef as need it when the ACS responds 
  75. $_SESSION[‘threeDSRef’] = $res[‘threeDSRef’]; 

107.} else if ($res[‘responseCode’] === Gateway::RC_SUCCESS) { 

  1. echo “<p>Thank you for your payment.</p>”

109.} else

  1. echo “<p>Failed to take payment: ” . htmlentities($res[‘responseMessage’]) . “</p>”

111.} 

115.// Render HTML to silently POST data to URL in target brower window 

116.function silentPost($url = ‘?’, array $post = null, $target = ‘_self’) { 

  1. $url = htmlentities($url); 
  2. $target = htmlentities($target); 
  3. $fields =
  4. if ($post) { 
  5. foreach ($post as $name => $value) { 
  6. $fields .= Gateway::fieldToHtml($name, $value); 
  7. $ret = ” 
  8. <form id=\“silentPost\” action=\”{$url}\” method=\”post\” target=\”{$target}\”
  9. {$fields} 
  10. <noscript><input type=\“submit\” value=\”Continue\”></noscript 
  11. </form> 
  12. <script> 
  13. window.setTimeout(‘document.forms.silentPost.submit()’, 0); 
  14. </script> 
  15. “; 
  16. return $ret; 

139.} 

141.?> 

A-23.2 Hosted Payment Page Library

A-23.2.1 Hosted Sale Transaction

 

The following example code shows how to prepare a payment form to open the Hosted Payment Page in a lightbox style overlay on your website using the Hosted Payment Page library:

 

  1. <html> 
  2. <head> 
  3. <!– Load the Hosted Payment Page library –> 
  4. <script src=“https://gateway.swipen.com/sdk/web/v1/js/hostedforms.min.js”></script> 
  5. </head> 
  6. <body> 
  7. <!– 
  8. Hosted Payment <form> as created by the Gateway Integration Library hostedRequest() method 
  9. with addition of ‘data-hostedforms-modal’ attribute to signify a modal form is required. 
  10. –> 
  11. <form name=“payment-form” method=“post” action=“https://gateway.swipen.com/hosted/” data-hostedforms-modal
  12. <input type=“hidden” name=“merchantID” value=“100001” /> 
  13. <input type=“hidden” name=“action” value=“SALE” /> 
  14. <input type=“hidden” name=“type” value=“1” /> 
  15. <input type=“hidden” name=“currencyCode” value=“826” /> 
  16. <input type=“hidden” name=“countryCode” value=“826” /> 
  17. <input type=“hidden” name=“amount” value=“1001” /> 
  18. <input type=“hidden” name=“orderRef” value=“Test purchase” /> 
  19. <input type=“hidden” name=“redirectURL” value=“https://www.merchant.com/payment/” /> 
  20. <input type=“hidden” name=“signature” value=“07599ef4cdb2e26cb2bf34a9c65190a7ce82494bc1df144c3bb0d20ee2655d8278dc663b2b0421ef12b8f081e821151bb4c644277c5d65b5523a96539b53b5aa” /> 
  21. <input type=“submit” value=“Pay Now”
  22. </form> 
  23. <script> 
  24. // Create a new Hosted Form object which will cause the above <form> to load into a modal 
  25. // overlay over this page. 
  26. var form = new window.hostedForms.classes.Form(document.forms[0]); 
  27. </script> 
  28. </body> 
  29. </html> 

 

A-23.2.2 Hosted Sale Transaction (jQuery)

 

The following example code shows how to prepare a payment form to open the Hosted Payment Page in a lightbox style overlay on your website using the Hosted Payment Page and jQuery libraries: 

 

1.<html> 

  1. <head> 
  2. <!– Load the jQuery library –> 
  3. <script src=“https://code.jquery.com/jquery-3.4.1.min.js” integrity=“sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=” crossorigin=“anonymous”></script> 
  4. <!– Load the Hosted Payment Page library –> 
  5. <script src=“https://gateway.swipen.com/sdk/web/v1/js/hostedforms.min.js”></script> 
  6. </head> 
  7. <body> 
  8. <!– 
  9. Hosted Payment <form> as created by the Gateway Integration Library hostedRequest() method 
  10. with addition of ‘data-hostedforms-modal’ attribute to signify a modal form is required. 
  11. –> 
  12. <form name=“payment-form” method=“post” action=“https://gateway.swipen.com/hosted/” data-hostedforms-modal
  13. <input type=“hidden” name=“merchantID” value=“100001” /> 
  14. <input type=“hidden” name=“action” value=“SALE” /> 
  15. <input type=“hidden” name=“type” value=“1” /> 
  16. <input type=“hidden” name=“currencyCode” value=“826” /> 
  17. <input type=“hidden” name=“countryCode” value=“826” /> 
  18. <input type=“hidden” name=“amount” value=“1001” /> 
  19. <input type=“hidden” name=“orderRef” value=“Test purchase” /> 
  20. <input type=“hidden” name=“redirectURL” value=“https://www.merchant.com/payment/” /> 
  21. <input type=“hidden” name=“signature” value=“07599ef4cdb2e26cb2bf34a9c65190a7ce82494bc1df144c3bb0d20ee2655d8278dc663b2b0421ef12b8f081e821151bb4c644277c5d65b5523a96539b53b5aa” /> 
  22. <input type=“submit” value=“Pay Now”
  23. </form> 
  24. <script> 
  25. // Create a new Hosted Form object which will cause the above <form> to load into a modal 
  26. // overlay over this page. 
  27. var form = $(document.forms[0]).hostedForm(); 
  28. </script> 
  29. </body> 
  30. </html> 

 

A-23.2.3 Hosted Sale Transaction #2 

 

The following example code shows how to create a payment form to open the Hosted Payment Page in a lightbox style overlay on your website using the Hosted Payment Page library: 

 

  1. <html> 
  2. <head> 
  3. <!– Load the Hosted Payment Page library –> 
  4. <script src=“https://gateway.swipen.com/sdk/web/v1/js/hostedforms.min.js”></script> 
  5. </head> 
  6. <body> 
  7. <!— Pay button placeholder –> 
  8. <div id=“paynow”></div> 
  9. <script> 
  10. // Create a new Hosted Form object which will render a payment button which will load 
  11. // the Hosted Payment Pageo load into a modal overlay over this page. 
  12. // The request can be provided from your server. 
  13. var req = { 
  14. merchantID: ‘100001’, 
  15. action: ‘SALE’, 
  16. type: ‘1’, 
  17. currencyCode: ‘826’, 
  18. countryCode: ‘826’, 
  19. amount: ‘1001’, 
  20. orderRef: ‘Test purchase’, 
  21. redirectURL: ‘https://www.merchant.com/payment/’, 
  22. signature: ‘07599ef4cdb2e26cb2bf34a9c65190a7ce82494bc1df144c3bb0d20ee2655d8278dc663b2b0421ef12b8f081e821151bb4c644277c5d65b5523a96539b53b5aa’, 
  23. }; 
  24. var data = { 
  25. id: ‘my-payment-form’, 
  26. url: ‘https://gateway.swipen.com/hosted/modal/’, 
  27. modal: true, 
  28. data: req, 
  29. submit: { 
  30. type: ‘button’, 
  31. label: ‘Pay <i>Now</i>‘ 
  32. }; 
  33. var form = new window.hostedForms.classes.Form(‘paynow’, data); 
  34. </script> 
  35. </body> 
  36. </html> 

 

A-23.2.4 Hosted Sale Transaction #2 (jQuery)

 

The following example code shows how to create a payment form to open the Hosted Payment Page in a lightbox style overlay on your website using the Hosted Payment Page and jQuery libraries: 

 

  1. <html> 
  2. <head> 
  3. <!– Load the jQuery library –> 
  4. <script src=“https://code.jquery.com/jquery-3.4.1.min.js” integrity=“sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=” crossorigin=“anonymous”></script> 
  5. <!– Load the Hosted Payment Page library –> 
  6. <script src=“https://gateway.swipen.com/sdk/web/v1/js/hostedforms.min.js”></script> 
  7. </head> 
  8. <body> 
  9. <!— Pay button placeholder –> 
  10. <div id=“paynow”></div> 
  11. <script> 
  12. // Create a new Hosted Form object which will render a payment button which will load 
  13. // the Hosted Payment Pageo load into a modal overlay over this page. 
  14. // The request can be provided from your server. 
  15. var req = { 
  16. merchantID: ‘100001’, 
  17. action: ‘SALE’, 
  18. type: ‘1’, 
  19. currencyCode: ‘826’, 
  20. countryCode: ‘826’, 
  21. amount: ‘1001’, 
  22. orderRef: ‘Test purchase’, 
  23. redirectURL: ‘https://www.merchant.com/payment/’, 
  24. signature: ‘07599ef4cdb2e26cb2bf34a9c65190a7ce82494bc1df144c3bb0d20ee2655d8278dc663b2b0421ef12b8f081e821151bb4c644277c5d65b5523a96539b53b5aa’, 
  25. }; 
  26. var data = { 
  27. id: ‘my-payment-form’, 
  28. url: ‘https://gateway.swipen.com/hosted/modal/’, 
  29. modal: true, 
  30. data: req, 
  31. submit: { 
  32. type: ‘button’, 
  33. label: ‘Pay <i>Now</i>‘ 
  34. }; 
  35. var form = $(‘#paynow’).hostedForm(data); 
  36. </script> 
  37. </body> 

43. </html>

A-23.3 Hosted Payment Fields Library

The following example code shows how to create and manage Hosted Payment Fields using the Hosted Payment Field library.

 

The example shows how to style fields using an inline stylesheet and how to listen and react to the field’s events.

 

The example also shows how to set up the payment form both automatically and manually and integrate with the jQuery validator plugin. You should choose the set-up method best suited for your needs and whatever validation plugin or functions you are familiar with.

 

Note: The example code demonstrates including the static transaction information, such as the merchantID and amount, in hidden form fields and POSTing the form directly to the Gateway’s Direct Integration using partial message signing. We would however recommend that you capture just the information you require and then POST this data to your own website where you can use it to build a new fully signed request to send to the Gateway’s Direct Integration as a server-to-server request.

 

  1. <html> 
  2. <head> 
  3. <!– Load the jQuery library –> 
  4. <script src=“https://code.jquery.com/jquery-3.4.1.min.js” integrity=“sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=” crossorigin=“anonymous”></script> 
  5. <!– Load the jQuery Validator plugin –> 
  6. <script src=“https://cdn.jsdelivr.net/npm/jquery-validation@1.19.1/dist/jquery.validate.min.js”></script> 
  7. <!– Load the Hosted Payment Field library –> 
  8. <script src=“https://gateway.swipen.com/sdk/web/v1/js/hostedfields.min.js”></script> 
  9. <!– General styles –> 
  10. <style> 
  11. body { 
  12. font-size: 14px; 
  13. .form-group { 
  14. margin: 4px 0 15px 0; 
  15. .form-group LABEL { 
  16. display: inline-block; 
  17. max-width: 100%; 
  18. margin-bottom: 5px; 
  19. font-weight: bold; 
  20. .form-control { 
  21. display: block; 
  22. box-sizing: border-box; 
  23. height: 34px; 
  24. width: 400px; 
  25. padding: 6px 12px; 
  26. font-size: 14px; 
  27. color: #555; 
  28. background-color: #fff; 
  29. background-image: none; 
  30. border: 1px solid #ccc; 
  31. border-radius: 4px; 
  32. -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075); 
  33. box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075); 
  34. -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s; 
  35. -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; 
  36. transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; 
  37. .form-control.hf-focus { 
  38. border-color: #66afe9; 
  39. outline: 0; 
  40. -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102,175,233,.6); 
  41. box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102,175,233,.6); 
  42. .has-error .form-control.hf-focus { 
  43. border-color: #843534; 
  44. -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px #ce8483; 
  45. box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px #ce8483; 
  46. </style> 
  47. <!– Hosted Field internal styles –> 
  48. <style class=“hostedfield”
  49. /* Grey out when disabled */ 
  50. .hostedfield:disabled { 
  51. cursor: not-allowed; 
  52. background-color: #eee; 
  53. opacity: 1; 
  54. /* Change border and text to green when valid */ 
  55. .form-control:valid, 
  56. .hostedfield:valid { 
  57. border-color: #28a745 !important; 
  58. color: #28a745 !important; 
  59. /* Change border and text to red when invalid */ 
  60. .form-control:invalid, 
  61. .hostedfield:invalid { 
  62. border-color: #a94442 !important; 
  63. color: #a94442 !important; 
  64. /* Change text to light grey when readonly */ 
  65. .form-control:readonly, 
  66. .hostedfield:readonly { 
  67. color: lightgrey !important; 
  68. /* Emulate webkit auto fill style */ 
  69. .form-control.hf-autofill, 
  70. .hostedfield.hf-autofill { 
  71. background-color: rgb(250, 255, 189) !important; 
  72. background-image: none !important; 
  73. color: rgb(0, 0, 0) !important; 
  74. /* Add light blue placeholder */ 
  75. .form-control::placeholder, 
  76. .hostedfield::placeholder { 
  77. color: lightblue; 
  78. /* Show hovering over the control */ 
  79. .form-control:hover, 
  80. .hostedfield:hover { 
  81. font-style: italic; 
  82. /* Style by id (hosted field will have ‘-hostedfield’ appended to the id) */ 
  83. #form-card-number, #form-card-number-hostedfield { 
  84. color: darkcyan; 
  85. </style> 
  86. <!– Hosted Field card-number internal styles –> 
  87. <style class=“card-number”
  88. .hostedfield::placeholder { 
  89. color: orange; 
  90. </style> 
  91. </head> 
  92. <body> 
  93. <!– tokenise payment data and send directly to the Gateway –> 
  94. <form id=“form” method=“POST” novalidate=“novalidate” lang=“en” 
  95. action=“https://gateway.swipen.com/direct/” 
  96. data-hostedform-tokenize=‘{“#form-customer-name”: “customerName”}’
  97. <input type=“hidden” name=“merchantID” value=“100001”
  98. <input type=“hidden” name=“action” value=“SALE”
  99. <input type=“hidden” name=“type” value=“1”
  100. <input type=“hidden” name=“countryCode” value=“826”
  101. <input type=“hidden” name=“currencyCode” value=“826”
  102. <input type=“hidden” name=“amount” value=“1001”
  103. <input type=“hidden” name=“orderRef” value=“Test purchase”
  104. <input type=“hidden” name=“transactionUnique” value=“1234”
  105. <input type=“hidden” name=“redirectURL” value=“https://www.merchant.com/payment/”
  106. <input type=“hidden” name=“signature” value=“5a0dd6fed71ef68bb3f20175b6a04bbd9d1c904d32ae3f160bd3b8f55740207e5d1e8de5e7e9960b136407e7454b82e428b8378003aa0146df3efa91a3e61b17|merchantID,action,type,countryCode,currencyCode,amount,orderRef,transactionUnique,redirectURL”
  107. <input type=“hidden” name=“paymentToken” value=“”
  108. <div class=“form-group”
  109. <label for=“form-customer-name”>Name on card:</label> 
  110. <input id=“form-customer-name” type=“text” name=“paymentToken[customerName]” autocomplete=“cc-name” class=“form-control form-control-native hostedfield-tokenise” placeholder=“Firstname Surname” required
  111. </div> 
  112. <div class=“form-group”
  113. <label for=“form-card-number”>Card Number:</label> 
  114. <input id=“form-card-number” type=“hostedfield:cardNumber” name=“card-number” autocomplete=“cc-number” class=“form-control form-control-hosted” style=“background: #f2f8fb;” placeholder=“**** **** **** ****” required
  115. </div> 
  116. <div class=“form-group”
  117. <label for=“form-card-expiry-date”>Card Expiry Date:</label> 
  118. <input id=“form-card-expiry-date” type=“hostedfield:cardExpiryDate” name=“card-expiry-date” autocomplete=“cc-exp” class=“form-control form-control-hosted” required
  119. </div> 
  120. <div class=“form-group”
  121. <label for=“form-card-start-date”>Card Issue Date:</label> 
  122. <input id=“form-card-start-date” type=“hostedfield:cardStartDate” name=“card-start-date” autocomplete=“cc-iss” class=“form-control form-control-hosted” data-hostedfield=‘{“dropdown”:true}’ data-hostedfield-format=“N – m | y” data-hostedfield-min-date=“-40” data-hostedfeld-max-date=“0”
  123. </div> 
  124. <div class=“form-group”
  125. <label for=“form-card-cvv”>CVV:</label> 
  126. <input id=“form-card-cvv” type=“hostedfield:cardCVV” name=“card-cvv” autocomplete=“cc-csc” class=“form-control form-control-hosted” required
  127. </div> 
  128. <button id=“form-submit” type=“submit”>Pay <span></span></button> 
  129. </form> 
  130. <script> 
  131. // This example demonstrates both automatic and manual form setup 
  132. var automatic_setup = true
  133. $(document).ready(function () { 
  134. var $form = $(‘#form’); 
  135. // Listen for events on the form to see those sent from the Hosted Payment Fields 
  136. // (For demonstration purposes only) 
  137. $form.on(events); 
  138. if (automatic_setup) { 
  139. /////////////////////////////////////////////////////////////// 
  140. // FORM AUTOMATIC SETUP 
  141. /////////////////////////////////////////////////////////////// 
  142. var opts = { 
  143. // Auto setup the form creating all hosted fields (default) 
  144. autoSetup: true, 
  145. // Auto validate, tokenise and submit the form (default) 
  146. autoSubmit: true, 
  147. // Optional field configuration (by type) 
  148. fields: { 
  149. any: { 
  150. nativeEvents: true, 
  151. }, 
  152. cardNumber: { 
  153. selector: $(‘#form-card-number’), 
  154. style: ‘text-decoration: green wavy underline;’, 
  155. stylesheet: $(‘style.hostedfields, style.card-number’) 
  156. }; 
  157. try { 
  158. // Create form, automatically creating all child Hosted Payment Fields 
  159. $form.hostedForm(opts); 
  160. } catch(e) { 
  161. showError(‘Failed to create hosted form: ‘ + e); 
  162. throw e; // Can’t continue with this script 
  163. // Listen for some events from the form thrown by the auto methods 
  164. $form.on({ 
  165. // Let jQuery Validator check the form on submission 
  166. ‘hostedform:presubmit’: function (event) { 
  167. console.log(‘Form submitting’); 
  168. return $form.valid(); 
  169. }, 
  170. // Show form is valid 
  171. ‘hostedform:valid’: function (event) { 
  172. console.log(‘Form valid’); 
  173. return true; 
  174. }, 
  175. // Show any validation errors 
  176. ‘hostedform:invalid’: function (event, details) { 
  177. console.log(‘Form invalid’); 
  178. showFieldErrors(details.invalid); 
  179. return true; 
  180. }, 
  181. // Show general error 
  182. ‘hostedform:error’: function (event, details) { 
  183. showError(details.message); 
  184. return true; 
  185. }); 
  186. // Use jQuery validator to validate the form 
  187. $form.validate(); 
  188. // End of form automatic setup 
  189. } else { 
  190. /////////////////////////////////////////////////////////////// 
  191. // FORM MANUAL SETUP 
  192. /////////////////////////////////////////////////////////////// 
  193. try { 
  194. // Create the card number field with custom options 
  195. $(‘#form-card-number’).hostedField({ 
  196. nativeEvents: true, 
  197. style: ‘text-decoration: green wavy underline;’, 
  198. stylesheet: $(‘style.hostedfields, style.card-number’) 
  199. }); 
  200. // Create the remaining hosted fields 
  201. $(‘.form-control-hosted:input’, $form).hostedField({nativeEvents: true}); 
  202. } catch (e) { 
  203. showError(‘Failed to create hosted fields: ‘ + e); 
  204. throw e; // Can’t continue with this script 
  205. $form.validate({ 
  206. // Get the hosted form widget for the submitted form (Form1 only) 
  207. submitHandler: function () { 
  208. try { 
  209. console.log(‘getPaymentToken’); 
  210. // Check we have some enabled fields to submit 
  211. if ($($form[0].elements).filter(‘:enabled:not([type=“hidden”])’).length === 0) { 
  212. showError(‘You must enable some fields’); 
  213. return false; 
  214. var hostedform = $form.hostedForm(‘instance’); 
  215. var also = { 
  216. customerName: $(‘#form-customer-name’).val() 
  217. }; 
  218. hostedform.getPaymentDetails(also, true).then( 
  219. // Success validating the form and requesting a payment token 
  220. function (details) { 
  221. if (details.success) { 
  222. $form[0].elements[‘paymentToken’].value = details.paymentToken; 
  223. $form[0].submit(); 
  224. } else if (details.invalid) { 
  225. $form.valid(); 
  226. showFieldErrors(details.invalid); 
  227. } else { 
  228. showError(‘There was a problem fetching the payment token. Please seek assistance.’); 
  229. }, 
  230. // Failure either validating the form or requesting the payment details 
  231. function (e) { 
  232. showError(‘There was a problem fetching the payment token. Please seek assistance.’); 
  233. ); 
  234. } catch (e) { 
  235. showError(‘There was a problem fetching the payment token. Please seek assistance.’); 
  236. }); 
  237. // End of form manual setup 
  238. // Hide errors once all fields are valid 
  239. $(‘#form :input’).on(‘valid’, function () { 
  240. if ($(this.form).find(‘:invalid’).length === 0) { 
  241. hideError($(this.form)); 
  242. }) 
  243. // Listen for some events on the none Hosted Fields 
  244. $(‘.form-control-native’).on(‘invalid’, bsMarkInvalid); 
  245. $(‘.form-control-native’).on(‘valid’, bsMarkValid); 
  246. // Check we can see the Hosted Fields via their new class 
  247. // (For demonstration purposes only) 
  248. console.log($(‘.form-control-hosted.hostedfield-element’)); 
  249. // Check we can see the Hosted Fields via the psuedo element 
  250. // (For demonstration purposes only) 
  251. console.log($(‘.form-control:hostedfield’)); 
  252. }); 
  253. /////////////////////////////////////////////////////////////////// 
  254. // Supporting functions 
  255. /////////////////////////////////////////////////////////////////// 
  256. // Display events that are passed from hosted field 
  257. var events = { 
  258. ‘hostedfield:create.example’ : showEvent, 
  259. ‘hostedfield:destroy.example’ : showEvent, 
  260. ‘hostedfield:ready.example’ : showEvent, 
  261. ‘hostedfield:style.example’ : showEvent, 
  262. ‘hostedfield:placeholder.example’ : showEvent, 
  263. ‘hostedfield:invalid.example invalid.example’ : showEvent, 
  264. ‘hostedfield:userinvalid.example userinvalid.example’ : showEvent, 
  265. ‘hostedfield:valid.example valid.example’ : showEvent, 
  266. ‘hostedfield:uservalid.example uservalid.example’ : showEvent, 
  267. ‘hostedfield:disabled.example disabled.example’ : showEvent, 
  268. ‘hostedfield:enabled.example enabled.example’ : showEvent, 
  269. ‘hostedfield:required.example required.example’ : showEvent, 
  270. ‘hostedfield:optional.example optional.example’ : showEvent, 
  271. ‘hostedfield:readonly.example readonly.example’ : showEvent, 
  272. ‘hostedfield:readwrite.example readwrite.example’ : showEvent, 
  273. ‘hostedfield:focus.example focus.example’ : showEvent, 
  274. ‘hostedfield:blur.example blur.example’ : showEvent, 
  275. ‘hostedfield:mouseenter.example mouseenter.example’ : showEvent, 
  276. ‘hostedfield:mouseleave.example mouseleave.example’ : showEvent,

 

  1. ‘hostedfield:mouseover.example mouseover.example’ : showEvent, 
  2. ‘hostedfield:mouseout.example mouseout.example’ : showEvent, 
  3. ‘hostedfield:mousemove.example mousemove.example’ : showEvent, 
  4. ‘hostedfield:keydown.example keydown.example’ : showEvent, 
  5. ‘hostedfield:keypress.example keypress.example’ : showEvent, 
  6. ‘hostedfield:keyup.example keyup.example’ : showEvent, 
  7. ‘hostedfield:change.example change.example’ : showEvent, 
  8. ‘hostedfield:input.example input.example’ : showEvent, 
  9. ‘hostedfield:invalid.example invalid.example’ : bsMarkInvalid, 
  10. ‘hostedfield:valid.example valid.example’ : bsMarkValid, 
  11. ‘hostedfield:valid.example valid.example’ : hideError, 
  12. }; 
  13. function isInvalid(element) { 
  14. return !element[0].checkValidity(); 
  15. function showError(msg) { 
  16. $(‘#error-info’).html(msg).show(); 
  17. function hideError($form, msg) { 
  18. $(‘#error-info’, $form).hide(); 
  19. function showFieldErrors(errors) { 
  20. var msg = ‘<h5>Error</h5><p>The following fields are invalid:</p><ul>’
  21. for (var p in errors) { 
  22. msg += ‘<li><b>‘ + p + ‘:</b> ‘ + errors[p] + ‘</li>‘; 
  23. msg += ‘</ul>‘ 
  24. showError(msg); 
  25. function bsMarkInvalid(e) { 
  26. var element = (e instanceof $.Event ? this : e); 
  27. $(element).closest(‘.form-group’).addClass(‘has-error’); 
  28. function bsMarkValid(e) { 
  29. var element = (e instanceof $.Event ? this : e); 
  30. $(element).closest(‘.form-group’).removeClass(‘has-error’); 
  31. function showEvent(event) { 
  32. console.log(event); 
  33. console.log(‘Field ‘ + event.type + ‘ event: ‘, this, arguments); 
  34. jQuery.validator.setDefaults({ 
  35. ignore: [], 
  36. rules: { 
  37. ‘customer-name’: { 
  38. checkValidity: true, 
  39. required: false 
  40. }, 
  41. ‘card-details’: { 
  42. checkValidity: true, 
  43. required: false 
  44. }, 
  45. ‘card-number’: { 
  46. checkValidity: true, 
  47. required: false 
  48. }, 
  49. ‘card-expiry-date’: { 
  50. checkValidity: true, 
  51. required: false 
  52. }, 
  53. ‘card-start-date’: { 
  54. checkValidity: true, 
  55. required: false 
  56. }, 
  57. ‘card-issue-number’: { 
  58. checkValidity: true, 
  59. required: false 
  60. }, 
  61. ‘card-cvv’: { 
  62. checkValidity: true, 
  63. required: false 
  64. }, 
  65. keyup: null, // Don\’t validate on keyup 
  66. showErrors: function (errorMap, errorList) { 
  67. if (errorList && errorList.length) { 
  68. var errors = {}; 
  69. for (var i = 0, max_i = errorList.length; i < max_i; i++ ) { 
  70. var label = $(‘label[for=“‘ + errorList[i].element.id + ‘”]:not(“.error”)’).text(); 
  71. errors[label] = errorList[i].message; 
  72. showFieldErrors(errors); 
  73. this.defaultShowErrors(errorMap, errorList); 
  74. }, 
  75. highlight: bsMarkInvalid, 
  76. unhighlight: bsMarkValid, 
  77. errorPlacement: function (error, element) { 
  78. $(element).closest(‘.form-control:not(“.hostedfield-element”)’).after(error); 
  79. }); 
  80. $.validator.addMethod(‘checkValidity’, 
  81. function (value, element, params, message) { 
  82. element.checkValidity(); 
  83. var valid = (element.validationMessage === ”); 
  84. $(element).attr(‘aria-invalid’, !valid); 
  85. return valid; 
  86. }, 
  87. function (params, element) { 
  88. return element.validationMessage; 
  89. ); 
  90. </script> 
  91. </body> 

483.</html>

Integrated Payments - connecting your till to your terminal

Integrated payments - connecting your EPOS till to your card terminal - enables your business to process payments faster and increase your profits.

There are many benefits to an integrated solution for almost all business types, most importantly, the removal of human error, giving you accurate reporting from all tills and terminals.

At Swipen, we offer Integrated Payments free of charge and you can use our Pay at Table or Pay at Counter software, or both if it suits your business:

Pay at Table

A software design with restaurants in mind:

Split the bill at the table

Automatic table closing

Integrated gratuity & reporting

Turn tables faster

More efficient payment

Pay at Counter

Suitable for most businesses, offering:

Faster payments

Shorter queues

Better conversion

Greater profits

COVID secure

Discover which terminal type is best for your business

Portable

Restaurants

Pubs

Cafes

Countertop

Bars

Clubs

Takeaways

Retail & Shops

Take your payments to the next level

E-Commerce Payment Solutions

With the arrival of Covid-19 into all our lives, online only payments are looking to have a bright future that’s here to stay.

At Swipen, we want to bust the myth that taking payments online is complicated, and help you
adapt to this changing world.

We offer two types of E-Commerce payment solution either directly integrated with your website or a hosted payment page.

Directly Integrated

Integrated into your own website

Completely customisable

Branded to your business

Customers stay on your website

150 currencies supported

Shopping carts

No long-term contract

Alternative payment methods, including: Alipay, Apple Pay, Google Pay, WeChatPay

Hosted Payment Page

Easy to set up

Take payments in minutes

Swipen branded

Data processed by Swipen

150 currencies supported

Shopping carts

No long-term contract

Alternative payment methods, including: Alipay, Apple Pay, Google Pay, WeChatPay

Take your payments to the next level

Virtual Terminal - Taking Payments over the Phone

Many businesses find it useful to take payments over the phone, whether you’re a travel agent
needing to take deposits, a mobile tradesperson, travelling salesperson, you have a call centre, or you don’t have a website to take payments online.

Swipen’s Virtual Terminal allows you to take card payments over the phone quickly and securely.

Our solution is a web portal that can be used on a desktop, tablet or mobile device.

Virtual Terminal Key Features

More secure than a card terminal - Completing the payment over the phone with full customer details reduces the risk of chargebacks or fraud.

Pay By Link - Send a payment link to complete the purchase or pay a balance. This is also a useful feature for customers who prefer to not give their details over the phone.

Capture Customer Details - The Virtual Terminal allows you to capture all the customer details you will need for your CRM or Booking Systems reducing the need for double inputting.

Control Permissions - Restrict user access to only certain functionality so you can control what your staff can process and see.

Take Payments anywhere - The Virtual Terminal is compatible to all devices and allows you to take payments from anywhere - office, home or on the move in a safe and secure way.

Ideal for call centres, travel agents, travelling salespeople, mobile tradespeople, restaurants for pre-bookings and parties, hotels for rooms and events, or any business that doesn’t have a website that customers can pay through.

Take your payments to the next level

Web & App Solutions - Order and Pay-at-Table Platform

With COVID regulations in force across the country, restaurants and pubs are adjusting the way they work to reduce the spread of this virus.

Swipen are also adapting to these changing times, and working with our expert partners, we can now offer order and pay-at-table platforms, allowing you to benefit from cashless and cardless payment options.

Our solutions can be either Web or App based and we provide the choice between
a ‘Simple Solution’ and a ‘Bespoke Solution’, depending on the size of your business

Bespoke Solution

The best option for individual pubs and restaurants, small chains, or if location offers a different menu:

Use your own branding

At table QR code or WiFi login

Bespoke rates and fees

Links to your EPOS till *

*Depending on the EPOS company

Simple Solution

Ideal for larger chains where every location requires exactly the same functionality and offers the same menu:

Custom built to fit your business

Customers can access the way you want

Links to both your till and kitchen

No training required

Working with Pizza Hut

Swipen have helped create a bespoke value-for money solution for Pizza Hut, and we could do the same for you.

Get in contact to find out more.

Take your payments to the next level

Tip Per Tap -Contactless Tipping System

With the dawn of cashless and touchless checkouts along with app ordering systems and pay online methods, many restaurants, bars, cafés and hotels are finding that their waiting staff are no longer able to receive cash or card tips.

Swipen has the perfect solution: the new ‘Tip Per Tap’ Contactless Tipping System

Directly Integrated

A dedicated terminal is placed in a prominent location in your restaurant.

The terminal is set to ‘donation’ and the debit amount is set at a specific figure. e.g. £2

Your happy customers simply tap their card, phone or watch against the terminal to leave a £2 tip.

They can tap multiple times to leave a larger amount

Works automatically without the need for a member of staff to supervise.

End-of-day report is separate, making it quicker and easier to share the total tips received between staff members.

How about a little Tip Per Tap

Read our blog all about our new Tip Per Tap Contactless Tipping System.

Get in contact to find out more.

Take your payments to the next level