使用Klarna支付, 从发起付款到显示小部件到创建订单完整详细流程

Klarna是欧洲流行的一种支付方式, 支付方式有立即,以后支付,分期付款
我们通过立即支付的方式调通支付接口
klarna的文档是英文的, 语言不通和客服沟通费劲, 记录下完整调试过程, 以便后来人提高接入效率.

开始之前创建一个新的测试帐户(有测试账户的人忽略此部分)。
要创建新的测试帐户，请执行以下步骤：
klarna 测试之前

1. 单击 Klarna Docs 导航栏中的商户门户​​按钮。
2. 选择您的凭证所在的地区（例如，🇪🇺 欧洲）。
3. 选择Playground作为环境。
4. 点击注册。
5. 输入您的电子邮件地址，然后单击注册。您将在此地址收到一封确认电子邮件。
6. 打开确认电子邮件，然后单击激活帐户。
7. 完成设置您的帐户：接受条款和条件。选择一个新密码。输入你的名字。登录到商家门户。
8. 使用 Klarna 进行

付款的端到端流程包括三个主要步骤

一. 发起付款

会创建一个会话，用于识别向 Klarna 的购买。

当您的客户想要使用 Klarna 付款时，您必须打开一个付款会话并在对端点的POST请求中共享购物车详细信息。{apiURL}/payments/v1/sessions在该请求中，您还指定付款是一次性的还是经常性的。

一旦您开始付款会话，它会保持打开状态 48 小时或直到您下订单。您还可以发送单独的POST请求以取消会话。

base URL - 实时（生产）
欧洲： https://api.klarna.com/
北美： https://api-na.klarna.com/
大洋洲： https://api-oc.klarna.com/

base URL - 测试（操场）
欧洲： https://api.playground.klarna.com/
北美： https://api-na.playground.klarna.com/
大洋洲： https://api-oc.playground.klarna.com/

请求发送参数

{
  "intent": "buy",//一次性支付
  // "intent": "tokenize",//结帐时无需付款的定期付款
  // "intent": "buy_and_tokenize",//结帐时付款的定期付款
  "purchase_country": "US",
  "purchase_currency": "USD",
  "locale": "en-US",
  "order_amount": 10,
  "order_tax_amount": 0,
  "order_lines": [{
    "type": "physical",
    "reference": "19-402",
    "name": "Battery Power Pack",
    "quantity": 1,
    "unit_price": 10,
    "tax_rate": 0,
    "total_amount": 10,
    "total_discount_amount": 0,
    "total_tax_amount": 0,
    "image_url": "https://www.exampleobjects.com/logo.png",
    "product_url": "https://www.estore.com/products/f2a8d7e34"
  }]
}

locale Klarna 小部件上显示的信息语言。了解有关在 API 调用中使用语言环境的更多信息。
purchase_country 进行购买的国家/地区。了解有关受支持国家/地区的更多信息。
purchase_currency 向客户收取费用的货币。了解有关支持货币的更多信息。
order_amount 订单的总价格，包括税费和折扣。
order_lines 采购中订单行的详细信息。
intent 付款会话的目的。

成功会返回:client_token(下一步要用!)
另外要注意payment_method_categories会返回支持的付款方式pay_now pay_over_time``pay_later,
注意注意: 只有结果有返回的方式才能显示小部件!
如果得不到你期望的方式, 请检查是否配置了收款信息!!!

二. 结帐显示

Klarna 付款方式并授权购买。

2.1显示klarna小部件
本地创建一个html文件,写入下方代码(记得改client_token), 保存浏览器打开

 <script src="https://x.klarnacdn.net/kp/lib/v1/api.js" async></script>
 <script>
   window.klarnaAsyncCallback = function() {
     Klarna.Payments.init({
       client_token: "上一步返回的client_token",
     });

     Klarna.Payments.load({
         container: "#klarna-payments-container1",
         payment_method_category: "pay_now",
       },
       function(res) {
       // 成功会返回 {show_form: true}
         console.log(res);
         console.debug(res);
       }
     );
  </script>

浏览器打开页面已经生成小部件
如果得不到你期望的小部件, 请检查是否配置了收款信息!!!

2.2 用户开始支付
前面生成了小部件你会发现没有下一步按钮, 其实按钮是需要你自己写一个,然后调起支付动作

  <button onclick="payHanle()">确定支付</button>
  <script>
    function payHanle() {
      Klarna.Payments.authorize({
        payment_method_category: "pay_now"
      }, {
        // "purchase_country": "SE",
        // "purchase_currency": "SEK",
        // "locale": "sv-SE",
      }, function(res) {
        // 用户支付成功回调
		// authorization_token: "b4bd3423-24e3",
		// approved: true,
		// show_form: true
		if (res.approved) {
			// 用户支付成功之后调用成功接口,进入下一步创建订单
		}
      })
    }
  </script>

测试支付需要填写正确测试数据

测试直接借记
要从客户的角度测试直接借记支付流程，请使用 IBAN 格式的号码。例如，以下示例 IBAN 编号适用于德国的测试商店：DE1152 0513 7351 2071 0131。
测试信用卡
要从客户的角度测试卡支付流程，请在加载的 Klarna 小部件中使用以下卡详细信息：

学分号：4111 1111 1111 1111
CVC: 123
到期日期： 12/28或 MM/YY 格式的任何其他未来日期
触发3-D 安全流程的卡号：4687388888888881
身份id
Field Name Field Value
芬兰 Henkilötunnus 190122-829F
挪威 Fødselsnummer 01087000571
瑞典 Personnummer 410321-9202

漂亮国测试数据

/	Private	person.
/	Approved	Denied
Date of Birth	10-07-1970	10-07-1970
First Name	Test	Test
Last Name	Person-us	Person-us
Street	Amsterdam Ave	Amsterdam Ave
House number	509	509
Apartment	Apt 214	Apt 214
Postal Code	10024	10024
City	New York	New York
Region	NY	NY
Phone Number	3106683312	3106354386
Email	customer@email.us	customer+denied@email.us
OTP(Random 6-digit different from 999999)	123456	123456

更多测试数据
更多测试地址数据

创建订单

使用上一步中的授权付款并创建订单。
要为一次性付款创建订单，请将POST请求发送到{apiUrl}/payments/v1/authorizations/{authorizationToken}/order 端点并包含authorization_token在路径中。

例如，如果authorization_token是b4bd3423-24e3，则将您的请求发送到{apiUrl}/payments/v1/authorizations/b4bd3423-24e3/order端点。
请求参数是前面创建sessions时候带的参数

成功之后回调下面的参数

{
    "order_id": "3eaeb557-5e30-47f8-b840-b8d987f5945d",
    "redirect_url": "https://payments.klarna.com/redirect/...",
    "fraud_status": "ACCEPTED",
    "authorized_payment_method": "invoice"
}

服务端代码

await axios({
  method: 'post',
  url: `${appConfig.klarna.baseUrl}/payments/v1/authorizations/${params.authorizationToken}/order`,
  data: {
  "intent": "buy",//一次性支付
  // "intent": "tokenize",//结帐时无需付款的定期付款
  // "intent": "buy_and_tokenize",//结帐时付款的定期付款
  "purchase_country": "US",
  "purchase_currency": "USD",
  "locale": "en-US",
  "order_amount": 10,
  "order_tax_amount": 0,
  "order_lines": [{
    "type": "physical",
    "reference": "19-402",
    "name": "Battery Power Pack",
    "quantity": 1,
    "unit_price": 10,
    "tax_rate": 0,
    "total_amount": 10,
    "total_discount_amount": 0,
    "total_tax_amount": 0,
    "image_url": "https://www.exampleobjects.com/logo.png",
    "product_url": "https://www.estore.com/products/f2a8d7e34"
  }]
},
  auth: {
    username: appConfig.klarna.authUsername,
    password: appConfig.klarna.authPassword
  },
  headers: {
    'Content-Type': 'application/json'
  },
  withCredentials: true
})
  .then(async response => {
    const data = response.data;
    console.log('支付成功回调', data);
    if (data.error_code) {
    // 失败
      return res.json(commonResult.fail());
    } else {
      return res.json(commonResult.success());
    }
  })
  .catch(error => {
    console.log(error.response);
  });

查看klarna后台订单

进入后台看到产生的订单了, 点进去能看到你传进来的商品详情

完成! 点赞! !