IOException during API request to Stripe. - Please help!

Ionic Native
1

Hi guys,

I need some help figuring out why I cannot seem to generate a token using the Ionic Native Stripe Plugin.

I have setup a REST endpoint using Node.js (backend) which when hit should obtain the stripetoken and an amount to be charged from the request body and then generate a charge. This is currently deployed on Heroku. I have tested this and it seems to be working fine.

What I can’t seem to figure out is why I cannot generate a token using the frontend ionic code (which I’m testing on an android device).

The error I get using the Android Debug Bridge (adb) command line tool ($ > adb logcat | grep -i "console") is shown below:

I/chromium(13604): [INFO:CONSOLE(215)] "Number is valid!", source: file:///android_asset/www/build/main.js (215)  
I/chromium(13604): [INFO:CONSOLE(231)] "IOException during API request to Stripe (https://api.stripe.com/v1/tokens): Unable to resolve host "api.stripe.com": No address associated with hostname Please check your internet connection and try again. If this problem persists, you should check Stripe's service status at https://twitter.com/stripestatus, or let us know at support@stripe.com.", source: file:///android_asset/www/build/main.js (231)

My Ionic Environment Info
cli packages:

@ionic/cli-plugin-cordova       : 1.6.2
@ionic/cli-plugin-ionic-angular : 1.4.1
@ionic/cli-utils                : 1.7.0
ionic (Ionic CLI)               : 3.7.0

global packages:

Cordova CLI : 7.0.1

local packages:

@ionic/app-scripts : 2.1.3
Cordova Platforms  : android 6.2.3
Ionic Framework    : ionic-angular 3.6.0

System:

Android SDK Tools : 25.2.5
Node              : v7.0.0
OS                : macOS Sierra
Xcode             : Xcode 8.3.3 Build version 8E3004b 
ios-deploy        : 1.9.0 
ios-sim           : 5.0.11 
npm               : 5.3.0

home.ts

import { Component } from '@angular/core';
import { NavController, AlertController, LoadingController } from 'ionic-angular';
import { Stripe } from '@ionic-native/stripe';
import { Http, Headers } from '@angular/http';
import 'rxjs/Rx';

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {

  public token;
  loading: any;
  public money:number = 0;

  public card: any = {
   number: '4242424242424242',
   expMonth: 12,
   expYear: 2020,
   cvc: '220'
 };

  constructor(
    public navCtrl: NavController,
    private stripe: Stripe,
    private http: Http,
    private alertCtrl: AlertController,
    public loadingCtrl: LoadingController
    ) {

  }

  presentPrompt() {
    let alert = this.alertCtrl.create({
      title: 'Card Information',
      inputs: [
        {
          name: 'cardNumber',
          placeholder: 'Card Number'
        },
        {
          name: 'expMonth',
          placeholder: 'expMonth'
        },
        {
          name: 'expYear',
          placeholder: 'expYear'
        },
        {
          name: 'cvc',
          placeholder: 'CVC'
        }
      ],
      buttons: [
        {
          text: 'Cancel',
          role: 'cancel',
          handler: data => {
            console.log('Cancel clicked');
          }
        },
        {
          text: 'Go',
          handler: data => {

            this.stripe.setPublishableKey('pk_test'); // I'm using my publishable key here

            this.stripe.validateCardNumber(this.card.number)
            .then(res => {console.log("Number is valid!")})
            .catch(error => {console.log(error)});

            this.stripe.createCardToken(this.card)
              .then(token =>  {
                console.log("***** Token is: ", token);
                let data = 'stripetoken=' + token + '&amount=50';
                let headers = new Headers();

                headers.append('Content-Type', 'application/x-www-form-urlencoded');
                this.http.post('https://glacial-gorge-47689.herokuapp.com/processpay', data, { headers: headers })
                .subscribe((res) => {
                  if (res.json().success) {
                    console.log('transaction Successfull!!');
                  }
                })


              })
              .catch(error => console.log(error));
            }
          }
        ]
      });
      alert.present();
     }
}

Any help figuring this out would greatly be appreciated. Been at this since yesterday and it’s beginning to drive me up the wall :sweat:

Thanks and have a great weekend!