UNNAX offers various methods to receive funds from your clients.


One such solution is our highly customizable widget, which you can embed on your site using your own branding, or if your use case is very specific you can do a full implementation with our API from scratch.


As for the pay-in methods available, you can use Direct Bank Transfers, Credit or Debit Card funding and also External cash-in for when your clients prefer to use their own payment method. 


What would you like to implement this time?



Widget PAY-IN (API Init)


The PAY-IN Widget will handle pay in transactions that could be initiated from a credit or debit card, or from a direct transfer from a bank account. You will need to include some HTML code, a JS library and make a few calls to our API. 


It’s not at all difficult, we'll show you how:


Step 1- Include this HTML code in the template that will host the Payments widget:


<iframe id="frame" name="frame" frameborder="0" width="500" height="680">
</iframe>

This iframe will render the UNNAX Payment Widget


Step 2-  Initialize your Widget. Call our API Init endpoint with your credentials and transaction information. You'll receive a response like this one:


{
 "data":
 {
 "products":["cashub_cc","cashub_dbt"],
 "widget_url":"https://integration.unnax.com/widget/pay/?sid=s_440f5c2b84ec4f12bf57555f50cdfdea",
 "sid":"s_9fe82d206f7c4cddbb4d9d46ec9d57df"
 }
}

For details on how to work with this endpoint, please refer to https://sandbox.unnax.com/3.0/transfer-pay-in/pay-init


Step 3- Expect the {{widget_url}} in your template and render it in your Iframe. Include this and the end of your HTML body.


<script type="text/javascript">
  document.getElementById(“iframe”).src = {{widget_url}}
</script>


Step 4- Render your view and pass the {{widget_url}} as parameter. When rendered inside your Iframe it will display the Unnax Widget.


 


  • For Credit Card or Debit Card payments, your client will be able to submit their Card information and complete the payment process.


  • For Direct Bank Transfers, your client will be able to enter their credentials and complete the Login and Transaction Signing process.

make_payin.gif


Step 5- Expect the callback. 



assignment_lateThis Interaction will trigger two different responses, as it is an asynchronous call you will receive those responses in the callback_url set in the Widget Initialization process. 



You will receive a message when the payment is authorized, and also when the payment is completed. You can find more information about the responses here:



Step 6- Tokenize credentials for recurring payments.


When payments are made using a Credit or Debit Card, a token is received within the response returned by the callback. This token is one half of a full token, the other half is stored by UNNAX. By using this “half-token” and the ID of the response you can perform new payments by implementing the Api Credit Card Charge without having to request to the client the card information again. 


{
  "result": {
    "pan": "1111",
    "currency": "978",
    "transaction_type": "pay",
    "expiration_date": "2021",
    "card_holder": "John Doe",
    "order_code": "PayCC",
    "token": "1a4b345233253ec23sd43f4ec3454faa056ac07b162",
    "date": "2017-03-14 11:54:00",
    "amount": 1234,
    "concept": "Pay Credit Card",
    "state":3
  },
  "error": [],
  "signature": "a07c4d48aa05asdasgwre001ce1423542qwer361efe2310aef71",
  "response": "OK",
  "response_id": "89bf578b436842dabd7c2651ad5e7e4c"
}

 


PAY-IN from external transfer


Whenever you need to receive transfers from clients that don’t want to provide their credentials through the Payments Widget, or simply want to place the payment directly from their bank’s internet banking, you can provide them a way to do it. Simply generate a set of parameters that will let you conciliate the payment whenever it is made.


Step 1- Create the expected transaction in UNNAX for future conciliation. 


Request sample


{
  "order_code": "order_code",
  "amount": 100,
  "destination_hash_account": "46abfcd3-0f9e-46dc-a3f5-885wef37bde9",
  "concept": "concept"
}

Response sample


{
  "transfer_concept": "UNX0000 order code concept"
  "destination_account" : "ES2211113111111111111111"
}

As you can see there is a transfer_concept and a destination_account. Those parameters should be the ones that your client must use when making the transfer or deposit. Along with amount of course. 


Step 2- Make the deposit or bank transfer with the provided transfer_concept and destination_account information


warning An error on any of the fields of the transfer (concept, amount or account) would translate in a not conciliated incoming payment and as a result it can be returned to the origin account.


For more information about this endpoint please visit: https://sandbox.unnax.com/3.0/external-cashin-pay-in/external-cashin