CHECKOUT

一次接入,让全球客户轻松付款。

一次接入,支持一次性付款与订阅扣款,自动适配本地语言和支付方式

  • 一次接入

    单次接入即可同时支持一次性购买与订阅扣款。

  • 全球化适配

    自动匹配本地语言和支付方式,减少全球收银台的摩擦。

  • 多端自适应

    收银台同时适配电脑和手机浏览器,让客户在常用设备上完成付款。

  • 无需维护

    新支付方式、页面更新和安全补丁都由 Waffo 团队处理。

01 / 两种体验

两种接入方式,同样完整的支付能力。

选择 Waffo 托管收银台,或将其嵌入你的产品。两种方式均支持支付与订阅,可根据前端开发与定制需求灵活选择。

跳转式收银台(Hosted)

Waffo 托管完整的支付页面。后端创建支付会话后,引导客户跳转至 Waffo 收银台,支付完成后返回你的网站。

前端 0 行代码卡信息不进入你的系统
  • 零前端开发页面渲染、表单验证、错误处理、3DS 认证全部由 Waffo 负责,你只需要在后端调用一个 API。
  • 持续自动优化Waffo 持续优化收银台的布局、文案与交互逻辑,所有优化自动应用到你的收银台,无需额外开发。
  • 卡信息隔离卡信息由 Waffo 托管的页面直接采集,不经过商户系统。
  • 零维护成本页面更新、新支付方式接入、安全补丁升级,全部由 Waffo 团队负责。

Waffo 托管页面

02 / 支付方式

为不同市场的客户,展示合适的支付方式。

Waffo 收银台根据支付模式、地区、币种及业务规则,自动展示适用的支付方式,让客户用熟悉的方式付款。

该市场的可用方式Indonesia: 12 / 17 个方式已接入
Indonesia
  • DANA
  • GoPay
  • OVO
  • ShopeePay
  • QRIS
  • Mandiri
03 / 支付体验流程

从下单到支付结果通知,全流程清晰衔接。

从创建订单到支付确认与结果通知,Waffo 串联完整流程,让客户顺畅完成付款。

01

确认订单

用户在你的网站点击「结算」,后端调用 Waffo API 创建 Payment Session 或 Subscription。

  • 生成唯一订单号
  • 预设金额与币种
02

唤起收银台

根据接入方式,用户被重定向至 Waffo 托管页,或在当前页面弹出收银台组件。

  • 优化至远低于 1 秒打开
03

选择支付方式

界面语言与所选支付方式对应的市场一致,便于买家理解。

  • 按支付方式预设语言
  • 自动适配移动端布局
04

授权并完成支付

用户输入卡号或扫码,系统仅在需要时触发 3DS 验证。支付失败时页面保留并提示具体原因,引导用户重试。

  • 3DS 在页内完成
  • 清楚说明支付被拒的原因
05

结果与通知

用户看到支付成功页;同时 Waffo 服务器向你的服务器发送 Webhook 通知,确保订单状态同步。

  • PAYMENT_NOTIFICATION
webhook → your server
POST https://yourstore.com/webhooks/waffo
{
  "eventType": "PAYMENT_NOTIFICATION",
  "paymentRequestId": "req_8Kd2f19",
  "status": "SUCCESS"
}
04 / UI 定制能力

我们的收银台,你的品牌风格。

品牌色、文字颜色、圆角和布局都可通过配置设置,无需维护分支代码。

Checkout customizationSave & Publish
Payment method orderJPN
Payment method nameSort
  • Apple Pay
  • Google Pay
  • BNPL3
  • au PAYau PAY
  • Over the Counter5
  • Payeasy Online Banking
  • PREPAIDCARD2
  • Credit/Debit Card
Live PreviewStyle changes will be reflected instantlyOne-time Payment
WStarter credit packArclight AI
$1.00
Price (excl. tax)$0.92
Tax$0.08
Total due today$1.00
Choose payment method
Pay
Secured by Waffo
05 / 多语言支持

让客户用熟悉的语言完成付款。

按商户语言设置、浏览器语言偏好及 IP 对应地区的优先顺序,自动匹配收银台语言,无需客户手动切换。

01简体中文
02ไทย
03Bahasa Indonesia
04日本語
05English
06其余支持的语言+8
  • Español (México)
  • 한국어
  • Bahasa Melayu
  • Polski
  • Português (Brasil)
  • Türkçe
  • Tiếng Việt
  • 繁體中文
06 / 开发与集成

选择适合的接入方式,支付能力一应俱全。

收银台可与 Waffo 的其他支付功能协同使用。不同接入方式对应不同的前端开发与定制需求,可用的收款能力保持一致

查看开发文档

以少量代码接入:创建支付会话并跳转至收银台,支持一次性付款与订阅扣款。

  • 前端无需开发
  • 支持一次性支付和订阅
Hostedserver · @waffo/waffo-node
const waffo = Waffo.fromEnv();

const res = await waffo.order().create({
  paymentRequestId: genRequestId(), // idempotency
  orderAmount: '12.90',
  orderCurrency: 'SGD',
  notifyUrl: 'https://yourstore.com/webhooks/waffo',
  successRedirectUrl: 'https://yourstore.com/paid',
});

// Waffo hosts the page — hand the shopper the link.
redirect(webUrlOf(res.getData().orderAction));

通过 SDK 或组件嵌入收银台,灵活控制支付体验与界面样式。

  • 页面内嵌 / 滑块 / 弹窗
  • 通过代码配置收银台样式
Embeddedbrowser · @waffo/checkout-js
const waffo = await loadWaffo(PUBLISHABLE_KEY);

// orderId comes from your own /api/orders route,
// which runs the server snippet above.
const checkout = await waffo.checkout.mount('#pay', {
  orderId,
  appearance: { theme: 'light', layout: 'split' },
  onComplete: ({ status }) => {
    if (status === 'SUCCESS') router.push('/paid');
  },
});

用于创建支付或订阅、查询状态、接收通知,并动态控制收银台行为。

  • Session 与订阅
  • 通过 Webhook 接收订单状态通知。
Webhookserver · order state of record
export async function POST(req: Request) {
  const event = await waffo.webhooks.verify(
    await req.text(),
    req.headers.get('waffo-signature'),
  );

  if (event.eventType === 'PAYMENT_NOTIFICATION') {
    await fulfil(event.paymentRequestId, event.status);
  }

  return new Response(null, { status: 200 });
}

关于收银台,常被问到的几件事。

收银台支持全球 480+ 种支付方式。具体向某位买家展示哪些方式,取决于其所在地区和你的配置。

是的。收银台符合相关支付安全与合规要求(如 PCI DSS),并通过安全通道处理敏感支付信息。

收银台页面会保留并提示失败原因,用户可以重新尝试或更换信用卡。常见失败原因包括余额不足、卡信息错误或银行拒绝交易。

企业在 Waffo 上线,独立开发者从 Pancake 开始。

两种选择,同一份承诺:你专注产品,Waffo 负责支付。