Klarna Payments

Follow this guide to add Klarna Installments, Financing, Pay Now or Pay with Klarna right to your checkout.

Brand constants to be used:

KLARNA_PAYMENTS_PAYLATER - Installments,
KLARNA_PAYMENTS_SLICEIT - Financing,
KLARNA_PAYMENTS_PAYNOW - Pay Now,
KLARNA_PAYMENTS_ONE - Pay with Klarna.

Klarna payment methods availability:

Native integration - since mSDK version 2.65.0;
Integration via redirect - mSDK version 2.58.0 and older.

Configuration

The Klarna Mobile SDK for iOS is available through the CocoaPods

Add the Klarna Mobile SDK as a dependency to your Podfile:
```
pod 'KlarnaMobileSDK'
```
NOTE: Klarna SDK provides different builds for different versions of Xcode and Swift which are specified in podspec. Make sure you are using right one, e.g. if you use Xcode 11 and Swift 5.2, you should specify pod like pod 'KlarnaMobileSDK/xcode-11.7-fat-basic'. It is recommended to use Klarna Mobile SDK version 2.4.0 or above.
Install pod in your project.
```
pod install
```

The Klarna Mobile SDK for Android is available in Maven Repository. Please follow the steps to add it to your application:

Add the Klarna Mobile SDK repository in the top-level build.gradle file:

repositories {
    maven {
        url 'https://x.klarnacdn.net/mobile-sdk/'
    }
}

Add the SDK as a dependency in the app's build.gradle:
```
implementation "com.klarna.mobile:sdk:2.x.x"
```
NOTE: It is recommended to use Klarna Mobile SDK version 2.4.0 or above.

[Optional] Support Java version 1.8

If you’re using Java, add compile options to support Java version 1.8 in the build.gradle.

android {
    ...
    compileOptions {
        sourceCompatibility JavaVersion.VERSION_1_8
        targetCompatibility JavaVersion.VERSION_1_8     
    }
    ...
}

Ready-to-Use UI

When you use our ready-to-use UI, everything works out-of-box. Just set payment brands and shopper result url in the Checkout Settings class and you are done. Proceed with the presenting checkout as for standard transaction.

OPPCheckoutSettings *checkoutSettings = [[OPPCheckoutSettings alloc] init];

// Set Klarna payment methods
checkoutSettings.paymentBrands = @[@"KLARNA_PAYMENTS_SLICEIT", @"KLARNA_PAYMENTS_PAYNOW", @"KLARNA_PAYMENTS_PAYLATER", @"KLARNA_PAYMENTS_ONE"];

// Set shopper result URL
checkoutSettings.shopperResultURL = @"com.companyname.appname.payments://result";

let checkoutSettings = OPPCheckoutSettings()

// Set Klarna payment methods
checkoutSettings.paymentBrands = ["KLARNA_PAYMENTS_SLICEIT", "KLARNA_PAYMENTS_PAYNOW", "KLARNA_PAYMENTS_PAYLATER", "KLARNA_PAYMENTS_ONE"]
// Set shopper result URL
checkoutSettings.shopperResultURL = "com.companyname.appname.payments://result"

Set<String> paymentBrands = new LinkedHashSet<String>();
paymentBrands.add("KLARNA_PAYMENTS_SLICEIT");
paymentBrands.add("KLARNA_PAYMENTS_PAYNOW");
paymentBrands.add("KLARNA_PAYMENTS_PAYLATER");
paymentBrands.add("KLARNA_PAYMENTS_ONE");

CheckoutSettings checkoutSettings = new CheckoutSettings(checkoutId, paymentBrands);

// Set shopper result URL
checkoutSettings.setShopperResultUrl("companyname://result");

val paymentBrands = hashSetOf("KLARNA_PAYMENTS_SLICEIT", "KLARNA_PAYMENTS_PAYNOW", "KLARNA_PAYMENTS_PAYLATER", "KLARNA_PAYMENTS_ONE") 
 
val checkoutSettings = CheckoutSettings(checkoutId, paymentBrands) 
 
// Set shopper result URL 
checkoutSettings.shopperResultUrl = "companyname://result"

NOTE: To learn more about shopper result url refer to Asynchronous Payments guide.

SDK & Your Own UI

If you use our mSDK just for backend communication, you will have to go through the Klarna SDK integration as well. In this guide we assume you already implemented all steps for performing standard mSDK transaction. Then there are 4 main steps:

1. Create Klarna session

First of all, create OPPKlarnaInlinePaymentParams object and submit a transaction. This is just an account discovery transaction (AD) without initiating a payment. Server will return:

client token id to authorize the session,
initial transaction id to be sent with the payment transaction on step 3,
callback urls to complete the transaction after all.

NSError *error = nil;
OPPKlarnaInlinePaymentParams *paymentParams = [OPPKlarnaInlinePaymentParams klarnaInlinePaymentParamsWithCheckoutID:checkoutID paymentBrand:@"KLARNA_PAYMENTS_SLICEIT" error:&error];
// Set shopper result URL
paymentParams.shopperResultURL = @"com.companyname.appname.payments://result";

if (error) {
    // See error.code (OPPErrorCode) and error.localizedDescription to identify the reason of failure.
} else {
    OPPTransaction *transaction = [OPPTransaction transactionWithPaymentParams:paymentParams];
    [self.provider submitTransaction:transaction completionHandler:^(OPPTransaction * _Nonnull transaction, NSError * _Nullable error) {
        if (error) {
            // Handle the error.
        } else {
            // Use the following params to complete transaction via Klarna Mobile SDK.
            NSString *clientToken = transaction.brandSpecificInfo[OPPTransactionKlarnaInlineClientTokenKey];
            NSString *initialTransactionId = transaction.brandSpecificInfo[OPPTransactionKlarnaInlineInitialTransactionIdKey];
            NSString *callbackUrl = transaction.brandSpecificInfo[OPPTransactionKlarnaInlineClientCallbackUrlKey];
            NSString *failureCallbackUrl = transaction.brandSpecificInfo[OPPTransactionKlarnaInlineClientFailureCallbackUrlKey];
        }
    }];
}

do {
    let paymentParams = try OPPKlarnaInlinePaymentParams(checkoutID: checkoutID, paymentBrand: "KLARNA_PAYMENTS_SLICEIT")
    // Set shopper result URL
    paymentParams.shopperResultURL = "com.companyname.appname.payments://result"

    let transaction = OPPTransaction(paymentParams: paymentParams)
    provider.submitTransaction(transaction) { (transaction, error) in
        if (error != nil) {
            // Handle the error.
        } else {
            // Use the following params to complete transaction via Klarna Mobile SDK.
            let clientToken = transaction.brandSpecificInfo[OPPTransactionKlarnaInlineClientTokenKey]
            let initialTransactionId = transaction.brandSpecificInfo[OPPTransactionKlarnaInlineInitialTransactionIdKey]
            let callbackUrl = transaction.brandSpecificInfo[OPPTransactionKlarnaInlineClientCallbackUrlKey]
            let failureCallbackUrl = transaction.brandSpecificInfo[OPPTransactionKlarnaInlineClientFailureCallbackUrlKey]
        }    
    }
} catch let error as NSError {
    // See error.code (OPPErrorCode) and error.localizedDescription to identify the reason of failure.
}

KlarnaInlinePaymentParams paymentParams = new KlarnaInlinePaymentParams(checkoutId, "KLARNA_PAYMENTS_SLICEIT");
// Set shopper result URL
paymentParams.setShopperResultUrl("companyname://result");

Transaction transaction = new Transaction(paymentParams);

/* use IProviderBinder to interact with service and submit transaction */
binder.submitTransaction(transaction);

val paymentParams = KlarnaInlinePaymentParams(checkoutId, "KLARNA_PAYMENTS_SLICEIT") 
// Set shopper result URL 
paymentParams.shopperResultUrl = "companyname://result" 
 
val transaction = Transaction(paymentParams) 
 
/* use IProviderBinder to interact with service and submit transaction */ 
providerBinder.submitTransaction(transaction)

@Override
public void transactionCompleted(Transaction transaction) {
    // Use the following params to complete transaction via Klarna Mobile SDK.
    String clientToken = transaction.getBrandSpecificInfo().get(Transaction.KLARNA_INLINE_CLIENT_TOKEN_KEY);
    String initialTransactionId = transaction.getBrandSpecificInfo().get(KLARNA_INLINE_INITIAL_TRANSACTION_ID);
    String callbackUrl = transaction.getBrandSpecificInfo().get(Transaction.KLARNA_INLINE_CALLBACK_URL_KEY);
    String failureCallbackUrl = transaction.getBrandSpecificInfo().get(Transaction.KLARNA_INLINE_FAILURE_CALLBACK_URL_KEY);
}

override fun transactionCompleted(transaction: Transaction) { 
    // Use the following params to complete transaction via Klarna Mobile SDK. 
    val clientToken = transaction.brandSpecificInfo[Transaction.KLARNA_INLINE_CLIENT_TOKEN_KEY] 
    val initialTransactionId = transaction.brandSpecificInfo[KLARNA_INLINE_INITIAL_TRANSACTION_ID] 
    val callbackUrl = transaction.brandSpecificInfo[Transaction.KLARNA_INLINE_CALLBACK_URL_KEY] 
    val failureCallbackUrl = transaction.brandSpecificInfo[Transaction.KLARNA_INLINE_FAILURE_CALLBACK_URL_KEY] 
}

NOTE: To learn more about shopper result url refer to Asynchronous Payments guide.

2. Proceed with the Klarna Mobile SDK

As soon as client token is received, you can initialize and load Klarna view. Just follow the steps from Klarna integration guide Klarna integration guide up to "Authorizing the Session".

Mapping of brand constants:

mSDK constant	Klarna category
"KLARNA_PAYMENTS_PAYLATER"	"pay_later"
"KLARNA_PAYMENTS_SLICEIT"	"pay_over_time"
"KLARNA_PAYMENTS_PAYNOW"	"pay_now"
"KLARNA_PAYMENTS_ONE"	"klarna"

Here is how KlarnaPaymentsView initialization will look like with the data received from the mSDK:

NSString *clientToken = transaction.brandSpecificInfo[OPPTransactionKlarnaInlineClientTokenKey];
[klarnaPaymentView initializeWithClientToken:clientToken returnUrl:transaction.paymentParams.shopperResultURL];

let clientToken = transaction.brandSpecificInfo[OPPTransactionKlarnaInlineClientTokenKey]
klarnaPaymentView.initialize(clientToken: clientToken, returnUrl: transaction.paymentParams.shopperResultURL)

String clientToken = transaction.getBrandSpecificInfo().get(Transaction.KLARNA_INLINE_CLIENT_TOKEN_KEY);
klarnaPaymentsView.initialize(clientToken, transaction.getPaymentParams().getShopperResultUrl());

val clientToken = transaction.brandSpecificInfo[Transaction.KLARNA_INLINE_CLIENT_TOKEN_KEY] 
klarnaPaymentsView.initialize(clientToken, transaction.paymentParams.shopperResultUrl)

3. Configure Pay button action

When shopper is ready and taps your Pay button, you should:

Submit payment transaction with an additional parameter first;
Then call Klarna SDK API to authorize the session (see the guide the guide).

You can reuse OPPKlarnaInlinePaymentParams object created in the step 1. Set initialTransactionId that was received earlier in the payment params and submit the transaction. It will initiate pre-authorization on the backend.

paymentParams.initialTransactionId = initialTransactionId;

OPPTransaction *transaction = [OPPTransaction transactionWithPaymentParams:paymentParams];
[self.provider submitTransaction:transaction completionHandler:^(OPPTransaction * _Nonnull transaction, NSError * _Nullable error) {
    // 1. Overwrite clientTokenId and callbacks with new values;
    // 2. Authorize the session with the Klarna SDK.
}];

paymentParams.initialTransactionId = initialTransactionId

let transaction = OPPTransaction(paymentParams: paymentParams)
provider.submitTransaction(transaction) { (transaction, error) in
    // 1. Overwrite clientTokenId and callbacks with new values;
    // 2. Authorize the session with the Klarna SDK.
} catch let error as NSError {
    // See error.code (OPPErrorCode) and error.localizedDescription to identify the reason of failure.
}

paymentParams.setInitialTransactionId(initialTransactionId);
    
binder.submitTransaction(new Transaction(paymentParams));

paymentParams.initialTransactionId = initialTransactionId 
 
providerBinder.submitTransaction(Transaction(paymentParams))

@Override
public void transactionCompleted(Transaction transaction) {
    // 1. Overwrite clientTokenId and callbacks with new values;
    // 2. Authorize the session with the Klarna SDK.
}

override fun transactionCompleted(transaction: Transaction) { 
    // 1. Overwrite clientTokenId and callbacks with new values; 
    // 2. Authorize the session with the Klarna SDK. 
}

4. Notify Server about payment completion

In order to complete the transaction you have to send additional request to backend.

If Klarna authorization is successful, check authToken is not empty and use callbackUrl to notify backend about transaction completion by sending a GET request.

NSString *callbackUrl = transaction.brandSpecificInfo[OPPTransactionKlarnaInlineClientCallbackUrlKey];
NSString *urlString = [callbackUrl stringByReplacingOccurrencesOfString:@"{{authorization_token}}" withString:authToken];

let callbackUrl = transaction.brandSpecificInfo[OPPTransactionKlarnaInlineClientCallbackUrlKey]
let urlString = callbackUrl.replacingOccurrences(of: "{{authorization_token}}", with: authToken)

String callbackUrl = transaction.getBrandSpecificInfo().get(Transaction.KLARNA_INLINE_CALLBACK_URL_KEY);
String urlString = callbackUrl.replace("{{authorization_token}}", authToken);

val callbackUrl = transaction.brandSpecificInfo[Transaction.KLARNA_INLINE_CALLBACK_URL_KEY] 
val urlString = callbackUrl!!.replace("{{authorization_token}}", authToken)

If some error occurred, then use failureCallbackUrl to notify server about it.

NSString *urlString = transaction.brandSpecificInfo[OPPTransactionKlarnaInlineClientFailureCallbackUrlKey];

let urlString = transaction.brandSpecificInfo[OPPTransactionKlarnaInlineClientFailureCallbackUrlKey]

String urlString = transaction.getBrandSpecificInfo().get(Transaction.KLARNA_INLINE_FAILURE_CALLBACK_URL_KEY);

val urlString = transaction.brandSpecificInfo[Transaction.KLARNA_INLINE_FAILURE_CALLBACK_URL_KEY]

NOTE: Expected response from callback urls is a redirect to the shopper result url. You might want to check that status and location of redirect url are valid, or it's also an option just to ignore the response. Request payment status as usual to get final result of the transaction.