# Native Checkout Integration

Integrate with Native Checkout API to build the checkout page for your sites/apps. Users pay in your sites/apps. No need to lead them to external pages. Take complete control of your users' checkout experience.

### Step 1: Create Payment Order

## Submit payment order and receive payment address

<mark style="color:green;">`POST`</mark> `https://admin.ccpayment.com/ccpayment/v1/bill/create`

Return receiving address/QR code and order information

#### Headers

| Name                                        | Type   | Description                                                                                                                                                                                             |
| ------------------------------------------- | ------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Sign<mark style="color:red;">\*</mark>      | String | SHA-256 (APPID + APP Secret +timestamp+<mark style="color:red;">**body (json string)**</mark>). [Signature guide](/~/changes/HSMg9pcC4k6HIczMjOvx/ccpayment-for-developer/to-get-started/signature.md). |
| Timestamp<mark style="color:red;">\*</mark> | String | Timestamp in seconds (10-digit) expires in 2 minutes                                                                                                                                                    |
| Appid<mark style="color:red;">\*</mark>     | String | Merchant's unique credential. Find it on the [Developer page](https://admin.ccpayment.com/developer/config)                                                                                             |

#### Request Body

| Name                                                    | Type    | Description                                                                                                                                                                                                                                                                                                                                                                                                                                                      |
| ------------------------------------------------------- | ------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| remark                                                  | String  | Remark                                                                                                                                                                                                                                                                                                                                                                                                                                                           |
| merchant\_order\_id<mark style="color:red;">\*</mark>   | String  | Order ID in Merchant's system. A unique ID for every order                                                                                                                                                                                                                                                                                                                                                                                                       |
| product\_price<mark style="color:red;">\*</mark>        | String  | Amount should be paid for this order (in USD by default, no more than two digits after the dot)                                                                                                                                                                                                                                                                                                                                                                  |
| token\_id<mark style="color:red;">\*</mark>             | String  | Tells CCPayment's server which coin and which network should be used for the transaction. You can get the token\_id by [calling the interface](/~/changes/HSMg9pcC4k6HIczMjOvx/ccpayment-for-developer/payment-api/token-id-interface.md) or find it [on this sheet](https://bit.ly/CCsupportedcoins)                                                                                                                                                            |
| denominated\_currency<mark style="color:red;">\*</mark> | String  | Currency for the order. Pass "token" if you want to show the price in crypto. Pass corresponding [currency code](https://doc.ccpayment.com/ccpayment-for-developer/resources-document/list-of-denominated-currency-for-api-payment) if you want to show the price in fiat.                                                                                                                                                                                       |
| order\_valid\_period                                    | Integer | <p>The valid duration for the order. </p><p><br>The parameter passed by the merchant should be less than the order's valid period in Merchant's system. Cause on-chain transactions may need some time to proceed.</p><p><br>BTC will arrive within 24 hours and other tokens will usually arrive within 30 minutes.</p><p></p><p>Orders will be valid for 24 hrs by default. The max valid duration is 10 days (max valid duration for Satoshi is 2 hours).</p> |

{% tabs %}
{% tab title="200: OK Success (200)/Fail (200)" %}
{% tabs %}
{% tab title="Success (200)" %}

#### **Response (Success 200)**

**Header**

**Body**

```json
{
	"code": 10000,
	"msg": "success",
	"data": {
		"amount": "0.5",
		"order_id": "202301090616511612332555323101184",
		"logo": "https://resource.cwallet.com/token/icon/usdt.png",
		"network": "TRC20",
		"pay_address": "TYWnk1EGALQyYst2yFSd29QQQTEkuKMbyt",
		"crypto": "USDT",
		"order_valid_period":823456
	}
}
```

**Parameters**
{% endtab %}

{% tab title="Fail (200)" %}

#### **Response (Fail 200)**

```json
{
	"code": 224066,
	"msg": "Service error, pleaser try again",
	"data": null
}
```

{% endtab %}

{% tab title="Remarks" %}
As a security measure, we will sign the returned data (and according to this only { code: 10000 } should be signed, but it's signing all the returned body.). Additionally, it will return Appid, Sign, Timestamp  in the header of the response.  The signature method SHA-256 (appid+appSecret+Timestamp+body).

Please use the data with caution if the signature verification fails. It indicates that the data has been tampered with.
{% endtab %}
{% endtabs %}
{% endtab %}
{% endtabs %}

<table><thead><tr><th>Name</th><th>Value</th><th width="108" data-type="checkbox">Required</th><th>Type</th><th>Description</th></tr></thead><tbody><tr><td>code</td><td>224066</td><td>true</td><td>Number</td><td></td></tr><tr><td>msg</td><td>Service error, please try again</td><td>true</td><td>String</td><td></td></tr><tr><td>data</td><td></td><td>true</td><td>Object</td><td></td></tr></tbody></table>

<table><thead><tr><th width="193">Name</th><th width="173">Value</th><th data-type="checkbox">Required </th><th>Type</th><th width="153">Description</th></tr></thead><tbody><tr><td>code</td><td>10000</td><td>true</td><td>Integer</td><td></td></tr><tr><td>msg</td><td>Success</td><td>true</td><td>String</td><td></td></tr><tr><td>data</td><td></td><td>true</td><td>Object</td><td></td></tr><tr><td>data.product_price</td><td>0.5</td><td>true</td><td>String</td><td>Amount (in USD by default)</td></tr><tr><td>data.order_id</td><td>202301090616511612332555323101184</td><td>true</td><td>String</td><td>CCPayment order ID</td></tr><tr><td>data.logo</td><td><a href="https://resource.cwallet.com/token/icon/usdt.png
">https://resource.cwallet.com/token/icon/usdt.png</a></td><td>true</td><td>String</td><td>Token icon </td></tr><tr><td>data.network</td><td>TRC20</td><td>true</td><td>String</td><td>Pay on this  Network</td></tr><tr><td>data.pay_address</td><td>TYWnk1EGALQyYst2yFSd29QQQTEkuKMbyt</td><td>true</td><td>String</td><td>Pay to this address</td></tr><tr><td>data.crypto</td><td>USDT</td><td>true</td><td>String</td><td>Token symbol</td></tr><tr><td>data.order_valid_period</td><td>823456</td><td>false</td><td>Integer</td><td></td></tr></tbody></table>

<table><thead><tr><th width="134">Name</th><th width="188">Value</th><th width="118">Required</th><th width="82">Type</th><th width="299">Description</th></tr></thead><tbody><tr><td>Appid</td><td>202302010636261620672405236006912</td><td>Y</td><td>String</td><td>Merchant's unique credential. Find it on the <a href="https://admin.ccpayment.com/developer/config">Developer page</a></td></tr><tr><td>Timestamp</td><td>1677152490</td><td>Y</td><td>String</td><td>Timestamp in seconds (10-digit) expires in 2 minutes</td></tr><tr><td>Sign</td><td>871f0223c66ea72435208d03603a0cb00b90f6ac4a4ba725d00164d967e291f6</td><td>Y</td><td>String</td><td>SHA-256(appId + appSecret + timestamp+<mark style="color:red;"><strong>body(json string)</strong></mark>)</td></tr></tbody></table>

### **Request Body Example**

{% tabs %}
{% tab title="Request Body" %}

```json
{
  "remark": "",
  "token_id": "0912e09a-d8e2-41d7-a0bc-a25530892988",
  "product_price": "0.5",
  "merchant_order_id": "3735077979050379",
  "denominated_currency": "USD",
  "order_valid_period":823456
}
```

{% endtab %}

{% tab title="Remark" %}
The body of HTTP is a json string .

Add the content in body of HTTP to the signature. Ensure the body content matches the signature content. As soon as CCPayment receives the request, the body content will be read and the signature will be verified.
{% endtab %}
{% endtabs %}

### Step 2: Configure Webhook to receive payment notification

CCPayment will notify merchant of the final transaction result. [Go to Webhook Configuration Guide](/~/changes/HSMg9pcC4k6HIczMjOvx/ccpayment-for-developer/resources-document/webhook-notification.md).

✅ Now you have completed the entire integration process for native checkout!

## Native checkout diagram

<figure><img src="/files/oQrxiO65X2RR4psnFVyf" alt=""><figcaption></figcaption></figure>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.ccpayment.com/~/changes/HSMg9pcC4k6HIczMjOvx/ccpayment-for-developer/payment-api/native-checkout-integration.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.