PonponPay
初級10 分で読める

Public Key モード

Public Key モードはブラウザ向けの連携方式です。フロントエンドは public_key で短期 Session Token を取得し、その Token で注文作成とステータス照会を行います。API Key をブラウザに公開する必要はありません。

連携フロー

  1. 加盟店ダッシュボードで Public Key を生成し、フロントエンド連携を有効化します。
  2. 許可するドメインのホワイトリストを設定します。
  3. ブラウザから Public Key で /api/v1/sdk/token を呼び出します。
  4. 返された Session Token で /api/v1/sdk/orders を呼び出します。
  5. payment_url にリダイレクトするか、注文ステータスをポーリングします。

現在の Public Key モードでは、フロントエンドでパラメータ署名を生成する必要はありません。JavaScript SDK の利用、または下記 API の手動呼び出しを推奨します。

Public Key の取得

  1. PonponPay の加盟店ダッシュボードにログインします。
  2. "Frontend Integration" ページを開きます。
  3. フロントエンド連携を有効化します。
  4. pub_xxx 形式の Public Key を生成してコピーします。

ドメインホワイトリスト

Public Key は許可されたドメインからのみ使用できます。バックエンドは Origin または Referer を検証します。

  • localhost は開発環境でのみ許可してください。
  • 本番環境では実際のドメインのみを使用してください。
  • *.example.com のようなワイルドカードサブドメインに対応しています。

iframe、App WebView、中間決済ページ内で開かれる場合、Origin ヘッダーが安定して送信されないことがあります。本番前に Origin と Referer の挙動を確認してください。

推奨: JavaScript SDK

npm install @ponponpay/sdk

クライアント初期化

import { PonponPayClient } from '@ponponpay/sdk/browser';

const client = new PonponPayClient({
  publicKey: 'pub_your_public_key',
  baseUrl: 'https://api.ponponpay.com'
});

注文作成

const order = await client.createOrder({
  currency: 'USDT',
  network: 'tron',
  amount: 100,
  orderId: 'ORDER_123456',
  notifyUrl: 'https://your-site.com/webhook',
  redirectUrl: 'https://your-site.com/success'
});

window.location.href = order.paymentUrl;

注文ステータス照会

const status = await client.getOrderStatus(order.tradeId);
console.log(status.status);

SDK の詳細は JavaScript SDK セクション またはリポジトリ README を参照してください。

API を手動で呼び出す

1. 短期 Token を取得

const tokenRes = await fetch('https://api.ponponpay.com/api/v1/sdk/token', {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json'
  },
  body: JSON.stringify({
    public_key: 'pub_your_public_key',
    timestamp: Date.now()
  })
});

const tokenData = await tokenRes.json();
const token = tokenData.data.token;

2. Token で注文を作成

const orderRes = await fetch('https://api.ponponpay.com/api/v1/sdk/orders', {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json',
    Authorization: `Bearer ${token}`
  },
  body: JSON.stringify({
    currency: 'USDT',
    network: 'tron',
    amount: 100,
    order_id: 'ORDER_123456',
    notify_url: 'https://your-site.com/webhook',
    redirect_url: 'https://your-site.com/success'
  })
});

const orderData = await orderRes.json();
window.location.href = orderData.data.payment_url;

3. 注文ステータスを照会

const statusRes = await fetch(
  'https://api.ponponpay.com/api/v1/sdk/orders/T20240101120000123456/status',
  {
    headers: {
      Authorization: `Bearer ${token}`
    }
  }
);

const statusData = await statusRes.json();
console.log(statusData.data.status);

機能の範囲

機能対応説明
注文作成SDK token order APIs で対応しています。
注文ステータス照会Public Key に紐づく加盟店の注文のみ照会できます。
管理系 API 全般Public Key モードではブラウザに公開されません。
ブラウザで API Key を公開絶対に行わないでください。Public Key のみ使用してください。

セキュリティ

  • Public Key は公開可能ですが、ホワイトリスト内のドメインでのみ動作します。
  • Session Token は短期有効で、有効期限前に更新する必要があります。
  • バックエンドは timestamp、Origin ドメイン、加盟店のフロントエンド制限を検証します。
  • 本番環境では必ず HTTPS を使用してください。

サーバー側の管理 API が必要な場合は API Key モード.