Getting blank page on authentication on stripe payment gateway

Question

We are using stripe payment gateway in our app. Everything is working fine without authentication payment. But with authentication payment, we always get a blank page on the test and live both modes.

Can anyone tell me what the possible problem is?

below is my code

 override func viewDidLoad() {
    super.viewDidLoad()
    Stripe.setDefaultPublishableKey("kljkahsha7878asjdba78")
    view.backgroundColor = .white
    let stackView = UIStackView(arrangedSubviews: [cardTextField, payButton])
    stackView.axis = .vertical
    stackView.spacing = 20
    stackView.translatesAutoresizingMaskIntoConstraints = false
    view.addSubview(stackView)
    NSLayoutConstraint.activate([
      stackView.leftAnchor.constraint(equalToSystemSpacingAfter: view.leftAnchor, multiplier: 2),
      view.rightAnchor.constraint(equalToSystemSpacingAfter: stackView.rightAnchor, multiplier: 2),
      stackView.topAnchor.constraint(equalToSystemSpacingBelow: view.safeAreaLayoutGuide.topAnchor, multiplier: 2),
    ])
    startCheckout()
    
}

lazy var cardTextField: STPPaymentCardTextField = {
  let cardTextField = STPPaymentCardTextField()
  return cardTextField
}()

lazy var payButton: UIButton = {
  let button = UIButton(type: .custom)
  button.layer.cornerRadius = 5
  button.backgroundColor = .systemBlue
  button.titleLabel?.font = UIFont.systemFont(ofSize: 22)
  button.setTitle("Pay now", for: .normal)
  button.addTarget(self, action: #selector(pay), for: .touchUpInside)
  return button
}()

func displayAlert(title: String, message: String, restartDemo: Bool = false) {
  DispatchQueue.main.async {
    let alert = UIAlertController(title: title, message: message, preferredStyle: .alert)
    alert.addAction(UIAlertAction(title: "OK", style: .cancel))
    self.present(alert, animated: true, completion: nil)
  }
}

func startCheckout() {
    let obj_OperationWeb = OperationWeb()
    //        DesignModel.startActivityIndicator()
    DesignModel.StartBtnActivity(btnActivity)
    obj_OperationWeb.callRestApiForPayment(API_PINTENT, methodType: .POST, parameters: dictParams, onCompletion: { (dictResponse) in
        print(dictResponse)
        if !dictResponse.isEmpty {
            //userdetails
            if (dictResponse[RES_status]?.isEqual(RES_SUCCESS))! {
                DesignModel.StopBtnActivity(self.btnActivity, completionType: .COMPLETION_SUCCESS)
                let clientSecret = dictResponse.isKeyNull("data") ? "" : dictResponse["data"] as! String
                print("Created PaymentIntent")
                self.paymentIntentClientSecret = clientSecret
                
            } else if (dictResponse[RES_status]?.isEqual(API_STATUS_INVALID_TOKEN))! {
                DesignModel.StopBtnActivity(self.btnActivity, completionType: .COMPLETION_SUCCESS)
                
                
                self._IKAlertActionView.ShowikTopAlertSingleButton(MSG_TITLE, message: "Payment intent not created (unable to load page)", image: APP_IMAGE_FOR_ALERT, okButtontext: MSG_OK_BUTTON, alertPosition: .ALERT_TOP, alertType:.DUMMY)
                return }
            else  {
                DesignModel.StopBtnActivity(self.btnActivity, completionType: .COMPLETION_FAIL)
                self._IKAlertActionView.ShowikTopAlertSingleButton(MSG_TITLE, message: dictResponse[RES_msg] as! String, image: APP_IMAGE_FOR_ALERT, okButtontext: MSG_OK_BUTTON, alertPosition: .ALERT_TOP, alertType:.DUMMY)
                return
            }
        }
        else {
            DesignModel.StopBtnActivity(self.btnActivity, completionType: .COMPLETION_FAIL)
            
            self._IKAlertActionView.ShowikTopAlertSingleButton(MSG_TITLE, message: MSG_ERR_CONNECTION, image: APP_IMAGE_FOR_ALERT, okButtontext: MSG_OK_BUTTON, alertPosition: .ALERT_TOP, alertType:.DUMMY) }
    }) { (errorCode) in
        DesignModel.StopBtnActivity(self.btnActivity, completionType: .COMPLETION_FAIL)
        
        self._IKAlertActionView.ShowikTopAlertSingleButton(MSG_TITLE, message: MSG_ERR_CONNECTION, image: APP_IMAGE_FOR_ALERT, okButtontext: MSG_OK_BUTTON, alertPosition: .ALERT_TOP, alertType:.DUMMY)
    }

    
    
}

@objc
func pay() {
  guard let paymentIntentClientSecret = paymentIntentClientSecret else {
      return;
  }
  // Collect card details
  let cardParams = cardTextField.cardParams
  let paymentMethodParams = STPPaymentMethodParams(card: cardParams, billingDetails: nil, metadata: nil)
  let paymentIntentParams = STPPaymentIntentParams(clientSecret: paymentIntentClientSecret)
  paymentIntentParams.paymentMethodParams = paymentMethodParams

  // Submit the payment
  let paymentHandler = STPPaymentHandler.shared()
  paymentHandler.confirmPayment(withParams: paymentIntentParams, authenticationContext: self) { (status, paymentIntent, error) in
    switch (status) {
    case .failed:
        self.displayAlert(title: "Payment failed", message: error?.localizedDescription ?? "")
        self._IKAlertActionView.ShowikTopAlertSingleButton("Payment Fail", message: "Unknown Eror", image: APP_IMAGE_FOR_ALERT, okButtontext: MSG_OK_BUTTON, alertPosition: .ALERT_TOP, alertType:.DUMMY)
        break
    case .canceled:
        self.displayAlert(title: "Payment canceled", message: error?.localizedDescription ?? "")
        self._IKAlertActionView.ShowikTopAlertSingleButton("Payment Cancel", message: "Unknown Eror", image: APP_IMAGE_FOR_ALERT, okButtontext: MSG_OK_BUTTON, alertPosition: .ALERT_TOP, alertType:.DUMMY)
        break
    case .succeeded:
        self.displayAlert(title: "Payment succeeded", message: paymentIntent?.description ?? "")
        self._IKAlertActionView.ShowikTopAlertSingleButton("Payment Success", message: "Done", image: APP_IMAGE_FOR_ALERT, okButtontext: MSG_OK_BUTTON, alertPosition: .ALERT_TOP, alertType:.DUMMY)
        break
    @unknown default:
        fatalError()
        break
    }
  }
}


extension PaymentVC1: STPAuthenticationContext {
func authenticationPresentingViewController() -> UIViewController {
    return self
} }

Here is the video of app! here we are not getting OTP (authentication page).

Answer 1

I know it may be late, But, we had the same problem, run the app on a real device was the solution for us.