在React.js中如何实现两个用户之间的PayPal转账交易

前置方案选型 #

你需要用PayPal官方面向平台类产品的Marketplaces方案，该方案支持用户支付时资金直接拆分到对应发布者账户，无需经过你的平台账户周转，符合你的需求，旧版链式支付已经逐步淘汰，不用考虑。

前置准备工作 #

• 确认你的平台PayPal账号已经完成Marketplaces资质申请，你提到的管理员端凭证配置完成即满足该要求
• 在发布者注册/资料设置页新增PayPal账户绑定入口，引导发布者授权绑定自己的PayPal账户，你后台仅需存储发布者对应的PayPal商户ID，无需存储任何敏感凭证
• 后台提前配置好各品类的平台抽佣规则（如果有），后续订单生成时自动计算平台、发布者各自的应得金额

核心实现流程 #

后端逻辑（必须前置，避免资金风险） #

所有订单的收款方、金额信息都必须在后端生成，禁止前端传递这类敏感参数：

• 用户提交结账请求时，后端根据订单关联的发布者ID，拿到对应发布者的PayPal商户ID，计算好发布者应得金额、平台抽佣金额，调用PayPal接口创建带分账规则的订单，返回订单ID给前端

React 前端集成步骤 #

1. 安装官方React SDK：npm install @paypal/react-paypal-js
2. 在结账页父组件引入SDK初始化组件，用你平台的PayPal客户端ID初始化：

import { PayPalScriptProvider } from "@paypal/react-paypal-js";
// 外层包裹组件
<PayPalScriptProvider options={{ "client-id": "你的平台PayPal客户端ID" }}>
  <CheckoutPage />
</PayPalScriptProvider>

3. 在结账页内引入支付按钮组件，调用后端生成的订单：

import { PayPalButtons } from "@paypal/react-paypal-js";

const CheckoutPage = () => {
  return (
    <PayPalButtons
      createOrder={async (data, actions) => {
        // 请求你的后端接口获取带分账规则的PayPal订单ID
        const orderRes = await fetch("/api/order/create-paypal-order", {
          method: "POST",
          body: JSON.stringify({ orderInfo: 你的当前订单参数 })
        });
        const { orderId } = await orderRes.json();
        return orderId;
      }}
      onApprove={async (data, actions) => {
        // 支付成功后调用后端接口校验结果，更新订单状态
        await fetch("/api/order/confirm", {
          method: "POST",
          body: JSON.stringify({ orderId: data.orderID })
        });
        // 后续跳转到成功页等逻辑
      }}
    />
  )
}

风险注意项 #

• 所有分账规则、收款方信息禁止在前端计算/传递，必须由后端生成，避免前端篡改导致资金损失
• 提前在PayPal后台配置好退款、交易纠纷的责任划分规则，避免平台承担不必要的交易风险
• 发布者绑定PayPal账户时要做身份校验，避免出现收款账户异常导致的资金纠纷

内容的提问来源于stack exchange，提问作者ucoder21