Add custom networking to your Web Checkout screen

Out of date

You can customise the web checkout networking by injecting your own CheckoutDataService. This serves as an action creator that handles two networking calls asynchronously:

  • Start checkout: This action starts as soon as the web checkout opens and triggers an asynchronous networking call through a CheckoutApiClient.

    When the request comes back, it maps the networking model into a domain model by using CheckoutDomainModelMapper and triggers another action.

    This domain model then has all the remaining configuration that the webview needs to successfully open the web checkout.

    If the request is unsuccessful, an error action is triggered.

  • Complete checkout: A networking call is triggered with a CheckoutApiClient to complete checkout. It will return an action immediately.

The Checkout data service object

The CheckoutDataService object allows you to configure Api Client and domain model mapper by providing them in its initializer.

This means you can provide your own implementation of:

  • CheckoutAPIClient
  • CheckoutDomainModelMapper
  • CheckoutDataService

Follow the example below to complete this implementation:

import PoqWebCheckout
import PoqFoundation
import PoqPlatform
import PoqWebCheckoutClient
import ReSwift
class ClientModule: PoqModule {
func didAddToPlatform() {
// Override platform's deeplink logic.
let navigator = NavigationHelper.sharedInstance
navigator.mapRoute(navigator.cartTransferURL, toDestination: { _ in
navigator.openController(ClientModule.createWebCheckoutViewController())
})
}
static func createWebCheckoutViewController() -> UIViewController {
let router = CheckoutRouter(navigator: NavigationHelper.sharedInstance)
let supportedLocations = [CheckoutLocationDomainModel(host: "poq-web-carttransferdemo.azurewebsites.net", port: nil), CheckoutLocationDomainModel(host: "poq-web-carttransferdemo-uat.azurewebsites.net", port: nil)]
let checkoutBridgeConfiguration = CheckoutBridgeConfiguration(supportedLocations: supportedLocations, checkoutPaymentConfiguration: nil)
let checkoutType: CheckoutWebViewType = .bridge(configuration: checkoutBridgeConfiguration)
let customApiClient = CustomCheckoutApiClient(webCheckoutApiType: .checkout)
let customMapper = CustomCheckoutDomainModelMapper()
let customService = CustomCheckoutDataService(apiClient: customApiClient, domainModelMapper: customMapper)
return WebCheckoutBuilder<PoqCheckoutState>(router: router, type: checkoutType)
.withService(customService)
.build()
}
}
class CustomCheckoutApiClient: CheckoutApiClient {
public let webCheckoutApiType: WebCheckoutApiType
public init(webCheckoutApiType: WebCheckoutApiType) {
self.webCheckoutApiType = webCheckoutApiType
}
open func startCheckout(completion: @escaping StartCheckoutCompletionType) {
// Your custom implementation goes here.
}
open func completeCheckout(withOrder order: CheckoutOrder) {
// Your custom implementation goes here.
}
}
class CustomCheckoutDomainModelMapper: CheckoutDomainModelMapper {
func map(from networkModel: Checkout) -> CheckoutDomainModel {
// Your custom implementation goes here.
}
func map(from orderDomainModel: CheckoutOrderDomainModel) -> CheckoutOrder {
// Your custom implementation goes here.
}
}
/// The concrete implementation of CheckoutDataService.
class CustomCheckoutDataService: CheckoutDataService {
public let apiClient: CheckoutApiClient
public let domainModelMapper: CheckoutDomainModelMapper
public init(apiClient: CheckoutApiClient, domainModelMapper: CheckoutDomainModelMapper) {
self.apiClient = apiClient
self.domainModelMapper = domainModelMapper
}
open func startCheckout<State: CheckoutState>(state: State, store: Store<State>) -> Action? {
// Your custom implementation goes here.
}
open func completeCheckout<State: CheckoutState>(state: State, store: Store<State>) -> Action? {
// Your custom implementation goes here.
}
}