PonponPay
初級8 分で読める

Public Key Mode - Direct Frontend Redirect

Redirect directly to payment page via URL parameters from frontend, no backend server required.

What is Public Key Mode?

Public Key mode allows your frontend to construct a signed URL and redirect to PonponPay payment page directly. No backend server needed, perfect for static sites and frontend apps.

Get Your Public Key

  1. Log in to PonponPay merchant dashboard
  2. Go to "Frontend Integration" page
  3. Enable frontend integration
  4. Copy the Public Key (pub_xxx format)
  5. Configure domain whitelist

Domain Whitelist

For security, Public Key can only be used on configured domains. Add your website domain in merchant dashboard (wildcard supported).

⚠️ Use localhost for development. Use actual domain for production. Supports wildcard like *.example.com

URL Parameters

Required Parameters

ParameterTypeDescription
public_keystringMerchant Public Key
amountnumberPayment amount (2 decimal places)
currencystringCurrency (USDT/USDC/BUSD)
networkstringNetwork (tron/ethereum/bsc/polygon/solana)
timestampstringTimestamp (milliseconds)
signaturestringParameter signature

Optional Parameters

ParameterTypeDescription
order_idstringMerchant order ID (max 32 chars)
redirect_urlstringRedirect URL after payment
notify_urlstringWebhook callback URL

Parameter Signing

All parameters must be signed using HMAC-SHA256 to prevent tampering.

Signing Algorithm

import CryptoJS from 'crypto-js';

function generateSignature(params, publicKey) {
  // 1. 过滤并排序参数
  const sortedKeys = Object.keys(params)
    .filter(k => k !== 'signature')
    .sort();
  
  // 2. 拼接参数字符串
  const paramString = sortedKeys
    .map(key => `${key}=${params[key]}`)
    .join('&');
  
  // 3. 添加密钥
  const signString = `${paramString}&key=${publicKey}`;
  
  // 4. HMAC-SHA256 签名
  const signature = CryptoJS.HmacSHA256(signString, publicKey)
    .toString();
  
  return signature;
}

// 示例
const params = {
  public_key: 'pub_xxx',
  amount: '100.00',
  currency: 'USDT',
  network: 'tron',
  timestamp: '1704067200000'
};

const signature = generateSignature(params, 'pub_xxx');
console.log(signature);

Usage Examples

Examples for various frontend frameworks:

import CryptoJS from 'crypto-js';

// 配置
const PUBLIC_KEY = 'pub_your_public_key_here';
const PAYMENT_URL = 'https://checkout.ponponpay.com';

// 生成签名
function generateSignature(params, publicKey) {
  // 1. 按参数名排序
  const sortedKeys = Object.keys(params).filter(k => k !== 'signature').sort();
  
  // 2. 拼接参数字符串
  const paramString = sortedKeys
    .map(key => `${key}=${params[key]}`)
    .join('&');
  
  // 3. 添加密钥
  const signString = `${paramString}&key=${publicKey}`;
  
  // 4. HMAC-SHA256 签名
  const signature = CryptoJS.HmacSHA256(signString, publicKey).toString();
  
  return signature;
}

// 创建支付链接
function createPaymentUrl(amount, currency, network) {
  const params = {
    public_key: PUBLIC_KEY,
    amount: amount.toFixed(2),
    currency: currency,
    network: network,
    timestamp: Date.now().toString()
  };
  
  // 生成签名
  params.signature = generateSignature(params, PUBLIC_KEY);
  
  // 构造 URL
  const url = `${PAYMENT_URL}/checkout?${new URLSearchParams(params)}`;
  
  return url;
}

// 使用示例
const paymentUrl = createPaymentUrl(100, 'USDT', 'tron');
window.location.href = paymentUrl;

Security Notes

  • Signature Verification: All requests are verified to prevent tampering
  • Timestamp Verification: Requests must be within 5 minutes
  • Domain Verification: Strictly verify referrer domain against whitelist
  • Public Key is Safe: Public Key can be safely exposed in frontend code
  • Use HTTPS: Always use HTTPS in production