payment-gateway - 如何加载(多个)定义的 Klarna 付款方式？

Question

我正在构建一种 Klarna Payments 的沙箱集成(使其原则上工作并稍后将逻辑实现到真正的商店中)。文档中描述的第一步是 session creating ，已经起作用了。现在我正在尝试显示 Klarna 小部件。

documentation中的示例显示如何加载一种付款方式(pay_later/发票)。

Klarna.Payments.load({
    container: '#klarna-payments-container',
    payment_method_category: 'pay_later'
  }, function (res) {
    console.debug(res);
})

我对 pay_now 进行了相同的尝试，但没有成功(页面上显示消息“付款方式不可用”，{show_form: false} 在 res 对象中)。实际上我想看到一个包含三种付款方式的表单:pay_now、pay_later 和 pay_over_time。

我看了一下documentation load() 的。我的期望是找到像 payment_method_categories 这样的参数。但该方法只有 payment_method_category 并且它需要是一个字符串...

如何获取可用并加载的 Klarna 付款方式的定义列表？

可能某些设置位于 Klarna 后端/“控制中心”(Playground)中，或者需要调用 API 来使方法可用。如果是这样，需要做什么以及如何做？

Answer 1

Klarna Payments 文档有点令人困惑，或者我只是误解了它。无论如何，我认为该小部件提供了(完整的)表单，并且通过遵循其步骤我将获得付款表单。这是不对的。该小部件仅显示带有有关付款方式信息的 block 。实际的表单(单选按钮和用于授权调用的一个或多个按钮等)是实现者关心的问题。

要获取多种定义的 Klarna 付款方式，需要执行以下步骤:

1 Klarna 需要为此(测试)商家帐户激活这些方法。

session initialization call 的响应中列出了可用的方法(POST/payments/v1/sessions):

{
    "session_id": "...",
    "client_token": "...",
    "payment_method_categories": [
        {
            "identifier": "direct_bank_transfer",
            ...
        },
        {
            "identifier": "pay_later",
            ...
        },
        {
            "identifier": "pay_over_time",
            ...
        },
        ...
    ]
}

2 将单个支付 block 加载到单独的 HTML 容器中:

<script>
window.klarnaAsyncCallback = function () {
    Klarna.Payments.init({
        client_token: CLIENT_TOKEN
    });
    Klarna.Payments.load(
        {
            container: '#klarna-payments-container1',
            payment_method_category: 'pay_later'
        },
        function (res) {
            console.debug(res);
        }
    );
    Klarna.Payments.load(
        {
            container: '#klarna-payments-container2',
            payment_method_category: 'pay_over_time'
        },
        function (res) {
            console.debug(res);
        }
    );
    Klarna.Payments.load(
        {
            container: '#klarna-payments-container3',
            payment_method_category: 'direct_bank_transfer'
        },
        function (res) {
            console.debug(res);
        }
    );
};
</script>
<div id="klarna-payments-container1"></div>
<div id="klarna-payments-container2"></div>
<div id="klarna-payments-container3"></div>

结果应该是这样的:

就是这样。没有提供可见的表单元素(这意味着:它已经是正确的结果)。实现者负责表单，现在可以自由创建和装饰自定义表单。