托管支付

1. 配置您的 MoneyCollect 账户

首先，请确保您已在 MoneyCollect 后台上设置了账户。如果您尚未完成，请先按照“快速开始”中的所有步骤操作，然后再继续。

2. 部署服务端

MoneyCollect 使用 Session 对象来表达您的支付操作，追踪整个过程中的支付生命周期和状态变化。

创建结帐按钮

在您的网站上添加一个 Checkout 按钮，该按钮调用服务器api，以创建结账会话。

<html>
  <body>
    <button id="submit"><span id="button-text">结帐</span></button>
  </body>
  <script>
    // 关于订单的信息
    // 用于在服务器上计算订单总额
    var orderData = {
        items: [{ id: "photo-subscription" }],
        currency: "usd"
    };
    document.querySelector("#submit").addEventListener("click", function(evt) {
        evt.preventDefault();
        // 发起支付
        fetch("/create-checkout", {
            method: "POST",
            headers: {
                "Content-Type": "application/json"
            },
            body: JSON.stringify(orderData)
        }).then(function(result) {
            return result.json();
        }).then(function(data) {
            // 重定向到支付页面
            window.location.href = data.url;
        });
    });
  </script>
</html>

在服务器端添加接口以创建 Checkout Session。结算会话控制您的客户在托管支付页面上看到的内容。您可以使用以下选项进行配置：

amountTotal 客户需要支付的总金额。
currency 客户需要支付的货币。
lineItems 客户正在购买的商品列表。它可以在托管支付页面上为客户显示。显示的项目包括products'name（产品名称）、images（图片）和quantity（数量）。
通过设置orderNo，您可以将您的订单编号与结账会话关联起来。将来，您可以通过关联的orderNo在 MoneyCollect 后台中找到相应的付款信息。
如果没有提供账单地址信息billingDetails，则将在结账页面上从客户处收集该信息。

您还需要设置以下 URL，并确保它们可以被公开访问，这样 MoneyCollect 才能将您的客户重定向到这些页面。

returnUrl 您网站上的一个成功或订单确认页面，用于客户完成付款后重定向他们。
cancelUrl 如果客户在结帐期间取消付款，请通过 URL 将其重定向回您的网站。
notifyUrl 完成付款后，支付结果也会发送到此 URL。

如果结帐会话未在创建后 24 小时内支付，将自动被取消。
创建结算会话并成功响应后，请将您的客户重定向到响应中返回的结算页面的 url。

此外，您还可以根据具体需求灵活采取其他支付方式。

post("/create-checkout", (request, response) -> {

    // 使用您的私钥
    MoneyCollect.apiKey = "test_pr_NWZsa******";

    // 配置首选支付方式
    List<String> paymentMethodTypes = new ArrayList<>();
    paymentMethodTypes.add("card");
    paymentMethodTypes.add("kakao_pay");
    
    SessionCreateParams params = SessionCreateParams.builder()
        .setReturnUrl("http://localhost:6060/success.html")
        .setCancelUrl("http://localhost:6060/cancel.html")
        .setNotifyUrl("http://localhost:6060/success.html")
        .setPaymentMethodTypes(paymentMethodTypes)
        .setAmountTotal(19 * 100L)
        .setCurrency("USD")
        .setOrderNo("C"+System.currentTimeMillis())
        .setWebsite("https://www.mc.com").build();
    Session session = Session.create(params);
    return JSONObject.toJSONString(new CreateCheckoutResponse(session.getUrl()));
});

可以通过启动 Web 服务器（例如 localhost:4242）来测试接口。

测试

点击您的结帐按钮。
使用测试卡信息填写支付详细信息：
- 输入 4242 4242 4242 4242 作为卡号。
- 输入任何未来日期作为卡片有效期。
- 输入任何三位数字作为CVC。
- 输入客户的电子邮件。
- 输入客户的名字和姓氏。
- 输入账单详情。
单击支付。
您将被重定向到您的返回页面。

接下来，您可以在 MoneyCollect 后台中找到新的订单，并检查支付订单详情。

3. 创建确认页面

创建一个名为 <mark style="color:blue;">returnUrl</mark> 的页面，并在Checkout会话中提供，用于在您的顾客完成支付后，显示订单确认页面或订单详细信息。顾客完成支付后，将被重定向到该页面。

<html>
<head>
  <title>Thanks for your order!</title>
</head>
<body>
  <section>
    <p>
      We appreciate your business! If you have any questions, please email
    </p>
    <p>
      <a href="index.html">Restart demo</a>
    <p>
  </section>
</body>
</html>

如果您的客户在支付中取消，则创建结算会话中提供的 cancelUrl 页面，他们将被重定向到此页面。

<html>
<head>
  <title>Checkout canceled</title>
</head>
<body>
  <section>
    <p>Forgot to add something to your cart? Shop around then come back to pay!</p>
  </section>
  <p>
    <a href="index.html">Restart demo</a>
  <p>
</body>
</html>

4. 其他测试资源

您可以使用几个测试卡来确保您的集成已准备好投入生产。

您与任何的 CVC 、 postal code 和 future expiration date 一起使用。

5. 付款后

有关管理 WebHooks、处理退款和处理付款后的响应的详细指导，请参阅以下文档。

Previous在线支付 Next站内支付

Last updated 1 month ago