用途:BillingSDK 是 Dodo Payments 维护的开源 React 组件库,用于构建计费相关前端界面,如定价页、账户/计费页、用量计量、信用余额、发票历史、即将产生的费用,以及取消/升级/降级 UI。组件以源码形式复制进仓库(shadcn/ui 模式),而非从运行时 npm 包导入。
主要能力:官方注册表按用途分组,包括定价(pricing-table-one 至 pricing-table-eight)、订阅(subscription-management、usage-based-pricing、invoice-history、update-plan-card、update-plan-dialog、proration-preview、cancel-subscription-card、cancel-subscription-dialog)、用量与计费(usage-meter-linear、usage-meter-circle、usage-table、detailed-usage-table、billing-screen、billing-settings、billing-settings-2、upcoming-charges)、支付(payment-details、payment-method-selector、payment-card、payment-failure)、促销与试用(banner、limited-offer-dialog、trial-expiry-card)。组件只负责展示,接收数据并触发回调,不直接调用 Dodo。
使用方式:脚手架初始化用 npx @billingsdk/cli init;添加单个组件用 npx @billingsdk/cli add pricing-table-one,或通过 shadcn 注册表 npx shadcn@latest add @billingsdk/pricing-table-one。CLI 包为 @billingsdk/cli(最近版本 0.9.0)。服务端客户端放在 lib/dodopayments.ts,仅由路由处理器和服务端组件导入,使用 DODO_PAYMENTS_API_KEY 等环境变量。结账用 checkoutSessions.create,客户门户用 customers.customerPortal.create(customerID, {...}) 并读取 .link。
限制:组件要求 React 或 Next.js 加 Tailwind CSS 与 shadcn/ui 约定,非框架无关;CLI 另提供 Next.js、Express、Hono、Fastify、React 服务端模板,但官方页面与 BillingSDK 介绍对哪些模板已发布存在不一致,需以当前 CLI 为准。API 密钥绝不能进入浏览器,Dodo 没有可公开的密钥。不要 npm install billingsdk(根包为私有)。除 pricing-table-one 外,其他组件无公开 prop 示例,需安装后阅读生成文件的 props 类型。信用余额最终一致,约每分钟由后台任务扣减,不应据此拦截请求。价格显示文本需与 Dodo 后台对账。门户与结账链接通常 24 小时过期且结账单次使用。