# Kakao Pay

### 1. Configure Kakao Pay simple payment PG settings

Refer to the [**Kakao Pay settings**](https://portone.gitbook.io/docs-en/ready/2.-pg/pg/undefined) page to configure the PG settings.

![](https://2814812280-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FhTv8JEzyM5h4cYcL5StH%2Fuploads%2Fdhj1BJHKw9ICIOzOURec%2F%E1%84%89%E1%85%B3%E1%84%8F%E1%85%B3%E1%84%85%E1%85%B5%E1%86%AB%E1%84%89%E1%85%A3%E1%86%BA%202022-05-29%20%E1%84%8B%E1%85%A9%E1%84%92%E1%85%AE%208.08.40.png?alt=media\&token=efbb1274-9ab4-48bf-a85b-4159110d2eb1)

### 2. Request payment

To open the payment window, call [JavaScript SDK](https://portone.gitbook.io/docs-en/sdk/javascript-sdk) IMP.**request\_pay**(param, callback).

In PC browsers, <mark style="color:red;">**callback**</mark> is invoked after calling `IMP.request_pay(param, callback)`. In mobile browsers, the page is redirected to <mark style="color:red;">**m\_redirect\_url**</mark>.

{% tabs %}
{% tab title="General payment request" %}
{% code title="Javascript SDK" %}

```javascript
IMP.request_pay({
    pg : 'kakaopay',
    pay_method : 'card',  // Can be omitted
    merchant_uid: '{Merchant created Order ID}', //Example: order_no_0001
    name : 'Order name: Test payment',
    amount : 14000,
    buyer_email : 'iamport@siot.do',
    buyer_name : 'Customer name',
    buyer_tel : '010-1234-5678',
    buyer_addr : 'Samseong-dong, Gangnam-gu, Seoul',
    buyer_postcode : '123-456',
    m_redirect_url : "{URL to redirect to after payment approval}" //Example: http://yourservice.com/payments/complete
}, function(rsp) { // callback logic
	//* ...Omitted... *//
});
```

{% endcode %}

#### Key parameter description

**`pg`** <mark style="color:red;">**\***</mark>\*\* \*\*<mark style="color:green;">**string**</mark>

**PG code**

* If not specified and this is the only PG setting that exists, `default PG` is automatically set.
* If there are multiple PG settings, set to **`kakaopay`**.

**`pay_method`** <mark style="color:green;">**string**</mark>

**Payment method code**

Can be omitted

(Overwritten by the option(credit card or Kakao money) selected in Kakao Pay app)

**`merchant_uid`** <mark style="color:red;">**\***</mark>\*\* \*\*<mark style="color:green;">**string**</mark>

**Order ID**

Must be unique for each request.

**`amount`** <mark style="color:red;">**\***</mark>\*\* \*\*<mark style="color:purple;">**integer**</mark>

**Payment amount**

Must be an integer (not string)

{% embed url="<https://codepen.io/chaiport/pen/XWZZZgJ>" %}
Kakao Pay payment window example
{% endembed %}
{% endtab %}

{% tab title="Subscription payment request" %}
To open subscription payment window, specify the **customer\_uid** parameter.

{% hint style="warning" %}
**amount**

* If requesting **both billing key and initial payment**, specify the payment amount.
* If only requesting for billing key, set to <mark style="color:red;">**0**</mark>.
  {% endhint %}

{% code title="Javascript SDK" %}

```javascript
IMP.request_pay({
    pg : 'kakaopay',
    merchant_uid : '{Merchant created Order ID}', // Example: issue_billingkey_monthly_0001
    name : 'Order name: Billing key request test',
    amount : 0, // For display purpose only (set actual amount to also request payment approval).
    customer_uid : '{Unique ID for the card (billing key)}', // Required (Example: gildong_0001_1234)
    buyer_email: "johndoe@gmail.com",
    buyer_name: "John Doe",
    buyer_tel : '02-1234-1234',
    m_redirect_url : '{Mobile only - URL to redirect to after payment approval}' // Example: https://www.my-service.com/payments/complete/mobile
}, function(rsp) {
    if ( rsp.success ) {
        alert('Success');
    } else {
        alert('Failed');
    }
});
```

{% endcode %}

#### Key parameter description

**`pg`** <mark style="color:red;">**\***</mark>\*\* \*\*<mark style="color:green;">**string**</mark>

**PG code**

* If not specified and this is the only PG setting that exists, `default PG` is automatically set.
* If there are multiple PG settings, set to **`kakaopay`**.

**`customer_uid`** <mark style="color:red;">**\***</mark>\*\* \*\*<mark style="color:green;">**string**</mark>

**Credit card billing key**

Billing key to be mapped 1:1 with the user-entered credit card information.

**`amount`** <mark style="color:red;">**\***</mark>\*\* \*\*<mark style="color:purple;">**Integer**</mark>

**Payment amount**

0: only billing key, **> 0: billing key + initial payment**\\

#### Request payment with billing key (customer\_uid)

After successfully getting the billing key, the billing key is **stored on the i'mport server** mapped 1:1 with the specified `customer_uid`. For security reasons, the server cannot directly access the billing key. Subsequent payments can be requested by calling the [<mark style="color:blue;">**non-authenticated payment request REST API**</mark>](https://portone.gitbook.io/docs-en/api/api/api) with the `customer_uid` as follows:

{% code title="sever-side" %}

```
curl -H "Content-Type: application/json" \   
     -X POST -d '{"customer_uid":"your-customer-unique-id", "merchant_uid":"order_id_8237352", "amount":3000}' \
     https://api.iamport.kr/subscribe/payments/again
```

{% endcode %}
{% endtab %}
{% endtabs %}

{% hint style="info" %}
**Kakao Pay simple payment is processed in mobile Kakao App.**
{% endhint %}
