SecurePay SecureFrame example

I recently had to debug an application that uses SecurePay as an online payment system. Rather than using API integration, the application used SecureFrame, where SecurePay provides the payment page (e.g. via an iframe). I couldn’t find an example in the SecureFrame documentation, so here’s a minimal working example:

<!DOCTYPE html>
<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/3.1.2/components/core-min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/3.1.2/components/sha1-min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.11.2/moment.min.js"></script>
<script>
$(function() {
  var merchantId = "ABC0001";
  var password = "abc123";
  var txnType = "0";
  var primaryRef = "Test Reference";
  var amount = "100";
  var timestamp = moment.utc().format("YYYYMMDDHHMMSS");
  var fingerprint = CryptoJS.enc.Hex.stringify(
    CryptoJS.SHA1([merchantId, password, txnType, primaryRef, amount, timestamp].join("|"))
  );
  $('input[name="merchant_id"]').val(merchantId);
  $('input[name="txn_type"]').val(txnType);
  $('input[name="primary_ref"]').val(primaryRef);
  $('input[name="amount"]').val(amount);
  $('input[name="fp_timestamp"]').val(timestamp);
  $('input[name="fingerprint"]').val(fingerprint);
  $("form").submit();
});
</script>
</head>
<body>
<form action="https://payment.securepay.com.au/test/v2/invoice" method="post">
  <input type="hidden" name="bill_name" value="transact">
  <input type="hidden" name="merchant_id">
  <input type="hidden" name="txn_type">
  <input type="hidden" name="primary_ref">
  <input type="hidden" name="amount">
  <input type="hidden" name="fp_timestamp">
  <input type="hidden" name="fingerprint">
</form>
</body>
</html>

Leave a Reply