Add custom networking to your Web Checkout screen
Out of dateYou 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 PoqWebCheckoutimport PoqFoundationimport PoqPlatformimport PoqWebCheckoutClientimport 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. }}