PayGate

2 OpenPayAPI

OpenPayAPI is new payment method and is embedded on merchant page based on web 2.0 technologies. It does not require moving to new page or opening popup.

By clicking pay button, the proper payment interfaces according to payment methods is displayed on the merchant’s page, so the user can pay easily.

All communication between customer browser and PayGate server through OpenPayAPI is securely protected by strong HTTPS protocol.

Contents:

2.1 Purchase
2.2 Cancel

2.1 Purchase

2.1.1 Include Javascript

Include the OpenPayAPI.js in <head>.

<script src='https://api.paygate.net/ajax/common/OpenPayAPI.js' type='text/javascript'></script>

2.1.2 Payment form

<form method="post" name="PGIOForm">
  <input name="mid" type="text">
  <input name="paymethod" type="text">
  <input name="goodname" type="text">
  <input name="langcode" type="text">
  <input name="charset" type="text" value="UTF-8">
  <input name="goodcurrency" type="text">
  <input name="unitprice" type="text">
  <input name="receipttoname" type="text">

  <input name="cardnumber" type="text">
  <input name="cardexpireyear" type="text">
  <input name="cardexpiremonth" type="text">
  <input name="cardsecretnumber" type="text">

  <input name="tid" type="text">
  <input name="replycode" type="text">
  <input name="replyMsg" type="text">
  <input name="cardauthcode" type="text">
  <input name="profile_no" type="text">
  <input name="hashresult" type="text">

  <input name="commit" type="submit" value="Submit">
</form>

Lets explore some of these fields more:

mid

You need to set your MEMBER_ID in this field.

If you have setup separate _MEMBER_ID_s for Korean and International cards, you can fill the value of mid field accordingly. To know whether the credit card number entered is Korean or not, you can check the first 6 digits of card number to match Korean BIN numbers.

Download the Korean BIN numbers list here.

paymethod

Value of paymethod for Korean cards should be set to "card" and for international cards, it should be "104".

langcode

Valid langcodes are: "KR", "US", "JP", and "CN".

goodcurrency

Currencies supported are: "WON", and "USD".

unitprice

This needs to be set to "1004" for test transactions in "WON" and to "1" for transactions in "USD".

Remember, in test mode too, PayGate makes real transactions and you need to contact the support to refund the amount after a successful transaction.

tid

For every transaction a transaction id is created by PayGate JS before making a request to the API.

replycode

This is filled automatically by PayGate JS when response is returned. A replycode of "0000" means successful transaction.

replyMsg

In case of failure, you can see the error message returned by the API here.

profile_no

If Profile Payment Service is enabled on your MEMBER_ID, then you will get a subscription ID for customer in this field. You can use this profile_no to make payments for the same customer in future.

2.1.3 Response screen

Now, add a <div> at the same HTML level as above <form>.

<div id="PGIOscreen"></div>

OpenPayAPI popups for further authentication as well as the response is displayed in this <div>.

2.1.4 Callbacks

Implement methods to handle payment responses.

// This is called when a response is returned from PayGate API
function getPGIOresult() {
  displayStatus(getPGIOElement('ResultScreen'));
  verifyReceived(getPGIOElement('tid'), 'callbacksuccess', 'callbackfail');
}

// This is called when a response (success/failure) is returned from the API
function callbacksuccess() {
  var replycode = getPGIOElement('replycode');

  if (replycode == '0000') {
    alert('Payment was successful');
  } else {
    alert('Payment failed with code: ' + replycode);
  }
}

// This is called when there is a system error
function callbackfail() {
  alert('System error. Please try again.');
}

2.1.5 Submit the form

When user clicks "Submit", make a call to function doTransaction.

$('form[name="PGIOForm"]').on('submit', function(event){
  event.preventDefault();
  doTransaction(document.PGIOForm);
})

Now, our payment form is all set to make payments. Lets make some.

Korean credit card

Enter the card details and click on "Submit".
You will see an agreement of terms. Click on "I agree".

Enable the pop-ups in your browser and click on "Verified progress payment".

One or more dialogs will appear. Follow the authentication process for your card.
The dialog will close and you will see the response in <div id="PGIOscreen">.

International credit card

Enter the card details and click on "Submit".
You will see a popup to select the card type. Select and click on "Send".

That's it. Your transaction is completed and you will the response in same <div>.

Back to File

2.2 Cancel

2.2.1 Encrypt data

You need an AES CTR algorithm to encrypt the transaction id before passing it to the API. You can get the Ruby version of algorithm here.

require 'digest'

# Replace 'secret' with the secret API key for your Member ID.
api_key_256 = Digest::SHA256.hexdigest('secret')

# Replace 'testmember_123456.654321' with the tid of transaction you want to cancel
aes_ctr = AesCtr.encrypt('testmember_123456.654321', api_key_256, 256)

tid_encrypted = "AES256#{aes_ctr}"

2.2.2 Make request

require 'uri'
require 'net/http'

params = { callback: 'callback',
           mid: 'testmember',
           tid: tid_encrypted,
           amount: 1000 }

uri = URI('https://service.paygate.net/service/cancelAPI.json')
uri.query = ::URI.encode_www_form(params)
response = ::Net::HTTP.get_response(uri)
response.code
 => "200"
response.body
 => "callback({\"replyCode\"=>\"0000\", \"replyMessage\"=>\"Response has been completed\", \"content\"=>{\"object\"=>\"CancelAPI tid:testmid_123456.654321 SUCCESS payRsltCode:0000\"}})"