如何正确显示 Klarna Pay Over Time 小部件？

Question

我正在将 Klarna 集成到与 Adyen 绑定的沙盒环境中。我严格按照 docs 进行操作，但遇到一个问题，即小部件中没有显示“继续”按钮，从而阻止了结帐过程。

-预期-

-实际（缺少按钮）-

重新创建的代码：

Post 至：https://checkout-test.adyen.com/v67/payments

{
  "merchantAccount": "MERCHANTLLC",
  "reference": "123",
  "paymentMethod": {
    "type": "klarna_account"
  },
  "amount": {
    "currency": "USD",
    "value": 18210
  },
  "shopperLocale": "en_US",
  "countryCode": "US",
  "telephoneNumber": "1111111111",
  "shopperEmail": "test@gmail.com",
  "shopperName": {
    "firstName": "John",
    "lastName": "Doe"
  },
  "returnUrl": "http://someurl.com",
  "lineItems": [
    {
      "quantity": 1,
      "amountExcludingTax": "16900",
      "taxPercentage": "775",
      "description": "asdfasdf",
      "id": "123",
      "taxAmount": 1310,
      "amountIncludingTax": "18210",
      "productUrl": "http://producturl.com"
    }
  ]
}

其中 returns client_token：“ABC123”。然后使用该令牌通过 klarna docs:

加载小部件

 window['Klarna']['Payments'].init({
      client_token: 'ABC123'
    })
    window['Klarna']['Payments'].load({
      container: '#klarna-payments-container',
      payment_method_category: 'pay_over_time',
      instance_id: "klarna-payments-instance"
    },
      function (res) {
        console.log(res);
      })

回调返回的是 {show_form: true} 并且小部件加载了上面的 ACTUAL（MISSING BUTTON） 图片。我在这里错过了什么？我不明白为什么我没有在小部件中显示继续按钮。这个按钮然后授权 Klarna 中的用户，获取账单信息等。任何帮助将不胜感激！目标是显示 'Continue' 按钮。

Answer 1

在与 Klarna 团队交谈后回答我自己的问题。在开发方面，您需要创建自己的按钮并调用 'Authorize' 端点。可以在此处找到文档：https://developers.klarna.com/documentation/klarna-payments/integration-guide/authorize/

如何正确显示 Klarna Pay Over Time 小部件？

How to get Klarna Pay Over Time widget displayed correctly?

javascript

klarna

adyen

angular

klarna-widget