跳轉到主要內容
本指南以 Node.js 後端為例,帶你完成完整的支付整合。相同的概念適用於任何程式語言。

概覽

1. 搭建伺服器

安裝所需依賴:
npm init -y
npm install express axios
建立伺服器檔案:
// server.js
const express = require('express');
const crypto = require('crypto');
const axios = require('axios');

const app = express();

const KYREN_API_KEY = process.env.KYREN_API_KEY;
const KYREN_WEBHOOK_SECRET = process.env.KYREN_WEBHOOK_SECRET;
const KYREN_BASE_URL = 'https://api.kyren.top';

app.use(express.json());

2. 建立產品(一次性操作)

你只需建立一次產品,可以透過 API 或控制台完成。
async function createProduct() {
  const response = await axios.post(`${KYREN_BASE_URL}/v1/products`, {
    name: '1000 AI Credits',
    description: '充值 1000 個 AI API 額度',
    price: '9.99',
    currency: 'USD',
    metadata: { credits: '1000' }
  }, {
    headers: { 'x-api-key': KYREN_API_KEY }
  });

  console.log('產品已建立:', response.data.data.id);
  return response.data.data;
}

3. 建立收銀介面

新增一個在客戶點擊「購買」時建立 Checkout Session 的介面:
app.post('/api/buy-credits', async (req, res) => {
  try {
    const response = await axios.post(`${KYREN_BASE_URL}/v1/checkouts`, {
      productId: 'prod_abc123',
      successUrl: 'https://yoursite.com/payment/success',
      cancelUrl: 'https://yoursite.com/payment/cancel',
      customerEmail: req.body.email,
      metadata: { userId: req.body.userId }
    }, {
      headers: { 'x-api-key': KYREN_API_KEY }
    });

    res.json({ checkoutUrl: response.data.data.url });
  } catch (error) {
    console.error('建立收銀失敗:', error.response?.data);
    res.status(500).json({ error: '建立收銀失敗' });
  }
});

4. 處理前端重新導向

在前端將客戶重新導向到收銀頁面:
<button id="buy-btn">購買 1000 額度 - $9.99</button>

<script>
document.getElementById('buy-btn').addEventListener('click', async () => {
  const response = await fetch('/api/buy-credits', {
    method: 'POST',
    headers: { 'Content-Type': 'application/json' },
    body: JSON.stringify({
      email: 'customer@example.com',
      userId: 'user_123'
    })
  });

  const { checkoutUrl } = await response.json();
  window.location.href = checkoutUrl;
});
</script>

5. 處理 Webhook

新增 Webhook 端點以接收支付通知:
function verifySignature(payload, signature, timestamp) {
  const data = `${timestamp}.${payload}`;
  const expected = 'sha256=' + crypto
    .createHmac('sha256', KYREN_WEBHOOK_SECRET)
    .update(data)
    .digest('hex');

  const currentTime = Math.floor(Date.now() / 1000);
  if (Math.abs(currentTime - parseInt(timestamp)) > 300) {
    return false;
  }

  return crypto.timingSafeEqual(
    Buffer.from(expected),
    Buffer.from(signature)
  );
}

app.post('/webhooks/kyren',
  express.raw({ type: 'application/json' }),
  (req, res) => {
    const signature = req.headers['x-kyren-signature'];
    const timestamp = req.headers['x-kyren-timestamp'];
    const payload = req.body.toString();

    if (!verifySignature(payload, signature, timestamp)) {
      return res.status(400).send('Invalid signature');
    }

    const event = JSON.parse(payload);

    switch (event.type) {
      case 'order.paid':
        const { order_id, product_id, customer_email, amount, currency } = event.data;
        console.log(`收到付款: ${amount} ${currency},來自 ${customer_email}`);
        // TODO: 完成訂單 — 為使用者帳戶充值額度
        break;
      default:
        console.log(`未處理的事件類型: ${event.type}`);
    }

    res.status(200).send('OK');
  }
);

6. 啟動伺服器

app.listen(3000, () => {
  console.log('伺服器執行在 http://localhost:3000');
});
執行:
KYREN_API_KEY=kyren_test_xxx KYREN_WEBHOOK_SECRET=whsec_xxx node server.js

7. 測試流程

  1. 開啟你的應用,點擊「購買 1000 額度」
  2. 你將被重新導向到啟潤支付收銀頁面
  3. 輸入測試卡號 4242 4242 4242 4242
  4. 完成付款
  5. 檢查伺服器日誌 — 你應該能看到 Webhook 到達
恭喜!你已經成功整合了啟潤支付。準備好後,切換到生產 API 密鑰即可開始接收真實付款。

下一步

Webhook 事件

查看所有可用的 Webhook 事件類型

程式碼範例

查看其他語言的整合範例