HTML Form Submit Integration API

This document explains how to invoke the Checkout by constructing an HTML Form directly. Integration is possible without any SDK dependency.

Basic Structure

<form id="paymentForm" method="POST" action="{BASE_URL}{ACTION_PATH}" target="{TARGET}">
    <input type="hidden" name="mchtId" value="merchant-id" />
    <input type="hidden" name="method" value="payment-method" />
    <!-- ... payment method-specific parameters -->
</form>

<script>
document.getElementById('paymentForm').submit();
</script>

Action URL by Payment Method

Implementation by UI Type

Popup Method

function openPaymentPopup() {
    const width = 430;
    const height = 660;
    const left = (screen.width - width) / 2;
    const top = (screen.height - height) / 2;

    const popup = window.open('', 'paymentPopup',
        `width=${width},height=${height},left=${left},top=${top},scrollbars=yes`
    );

    if (!popup) {
        alert('Popup was blocked. Please disable popup blocking and try again.');
        return;
    }

    document.getElementById('paymentForm').target = 'paymentPopup';
    document.getElementById('paymentForm').submit();
}

Current Window Method

<form id="paymentForm" method="POST"
      action="https://tbnpg.settlebank.co.kr/card/main.do"
      target="_self">
    <!-- parameters -->
</form>

• Navigates to the Checkout within the current window
• Redirects to nextUrl after payment completion

New Tab Method

<form id="paymentForm" method="POST"
      action="https://tbnpg.settlebank.co.kr/card/main.do"
      target="_blank">
    <!-- parameters -->
</form>

• Displays the Checkout in a new tab
• Uses the browser's default behavior

Differences from SDK

Server-Side Processing

The HTML Form Submit method also requires the backend to generate transaction amount encryption (AES-256) and request signature hash (SHA-256), the same as with the SDK.

Payment Result Handling

After payment completion, the HTML Form Submit method redirects to the following URLs.

Result Reception Methods

Response Parameters

Key parameters delivered to nextUrl after payment completion.

Key transaction status codes: 0021 (Success), 0031 (Failure), 0041 (Pending), 0051 (In Progress)

For detailed result handling, refer to the Webhooks (notiUrl) Integration Guide.

Payment Method-Specific Parameters

The HTML Form Submit integration method is the same for all payment methods. Refer to the Checkout Integration document for detailed parameters and Action URLs per payment method.

Need technical support?

pgsupport@hecto.co.kr

Code Samples

HectoFinancial GitHub