open-pay / openpay-js

Openpay Javascript bindings
Apache License 2.0
24 stars 28 forks source link

OpenPay.deviceData.setup TypeError: Cannot read property 'setup' of undefined #19

Closed evallgar closed 3 years ago

evallgar commented 4 years ago

Todo marchaba bien, hasta ayer que apareció este error. Las modificaciones al software no corresponden en nada a openpay, sólo se cambiaron unos métodos de validación del usuario de manera síncrona (angular localStorage) a asíncrona (ionic-storage)

Ahora, al ejecutar este código marca el error ya comentado:

ngOnInit() {
    this.storageService.getItem('userData').then((userData) => {
      this.userData = JSON.parse(userData);
    });

    var form = (<HTMLFormElement>document.getElementById('payment-form'));

    OpenPay.setId('mptiot2sfxxxxxxxxxxx');
    OpenPay.setApiKey('pk_7dccea883598xxxxxxxxxxxxxxxxx');
    this.deviceSessionId = OpenPay.deviceData.setup("payment-form", "deviceIdHiddenFieldName");
    console.log(this.deviceSessionId);

    form.addEventListener('submit', event => {
      event.preventDefault();
      console.log(event);
      // $("#pay-button").prop("disabled", true);
      this.presentLoadingWithOptions();
      OpenPay.token.extractFormAndCreate('payment-form', success_callbak, error_callbak);
    });

    var success_callbak = (response) => {
      console.log(response);
      this.token_id = response.data.id;
      var token_input = (<HTMLInputElement>document.getElementById('token_id'));
      token_input.setAttribute('value', this.token_id);
      console.log(formToJSON(form.elements));
      if (response.data.card.points_card) {
        // Si la tarjeta permite usar puntos, mostrar el cuadro de diálogo
        this.loading.dismiss().then(() => {
          this.presentAlertConfirm();
        });
      } else {
        // De otra forma, realizar el pago inmediatamente
        this.createCardCharge(false);
      }
    };

    var error_callbak = (response) => {
      this.loading.dismiss().then(() => {
        this.presentToastWithOptions(response);
      });
    };

    const formToJSON = elements => [].reduce.call(elements, (data, element) => {

      data[element.name] = element.value;
      return data;

    }, {});

  }

Ambiente: Ionic 4

Ionic:

Ionic CLI : 5.4.11 (/usr/local/lib/node_modules/ionic) Ionic Framework : @ionic/angular 4.11.5 @angular-devkit/build-angular : 0.803.20 @angular-devkit/schematics : 8.3.20 @angular/cli : 8.3.20 @ionic/angular-toolkit : 2.1.1

Cordova:

Cordova CLI : 9.0.0 (cordova-lib@9.0.1) Cordova Platforms : android 8.1.0, ios 5.1.1 Cordova Plugins : cordova-plugin-ionic-keyboard 2.2.0, cordova-plugin-ionic-webview 4.1.3, (and 7 other plugins)

Utility:

cordova-res : 0.6.0 (update available: 0.8.1) native-run : 0.2.8 (update available: 0.3.0)

System:

Android SDK Tools : 26.1.1 (/Users/xxxxxxxxxxxxxxxxxxxx/Library/Android/sdk) ios-deploy : 1.10.0 ios-sim : 8.0.2 NodeJS : v12.10.0 (/usr/local/Cellar/node/12.10.0/bin/node) npm : 6.11.3 OS : macOS Catalina Xcode : Xcode 11.2.1 Build version 11B500`

srdzdv commented 4 years ago

Yo también estoy presenciando este error. ¿Alguna solución?

JULIOS98 commented 4 years ago

lo pudiste solucionar, estoy teniendo el mismo problema en laravel con vue

senter-logistics commented 4 years ago

you need to import <script type='text/javascript' src="https://js.openpay.mx/openpay-data.v1.min.js"></script>