ionische 2 inappbrowser POST Form mit Daten params

ich eine POST Form einer externen url einreichen möchten, die ein neues Fenster mit Post-Daten params mit der in App-Browser geöffnet werden soll, so wie kann ich dies tun in ionic2?ionische 2 inappbrowser POST Form mit Daten params

Quelle

2016-07-13 mahmoudismail

können Sie dies mit InAppBrowser in ionic 2 tun;

Installiere Inappbrowser cordova Plugin

Cordova Plugin hinzufügen Cordova-Plugin-inappbrowser
import die Inappbrowser Komponente

import {InAppBrowser} von 'ionischer-native';
Erstellen Sie eine JavaScript-Skript-Zeichenfolge, die wir im inappbrowser ausführen werden. Dabei erstellen wir dynamisch ein dynamisches Formular und posten Daten in die URL. für die brauchen wir eine HTML-Seite wie redirect.html erstellen und sie im www-Ordnern ablegen, und wir werden diese Datei in dem in App-Browser öffnen und ein Formular an die externen URL aus dieser HTML-Datei

schreiben

eine hTML-Datei erstellen und im www-Ordner der App platzieren redirect.html

<!DOCTYPE html> 
<html> 
<head> 
    <title>Redirecting to the payment page</title> 
</head> 
<body> 
    <b> 
    please wait we are redirecting to the payment page.... 
</b> 
    <form id="ts-app-payment-form-redirect"></form> 
</body> 
</html>

im compnent tun wie diese

let options = { 
     name: 'tanveer ahmad dar', 
     email: '[email protected]', 
     item_id: 1234, 
     reference: 1234, 
     item_descr: 'description', 
     item_quant: 1, 
     item_valor: 50 * 100 
    }; 

let formHtml:string = ''; 
for(let key in Options){ 
    if (result.hasOwnProperty(key)) { 
     let value = result[key]; 
     formHtml+='<input type="hidden" value="'+value+'" id="'+key+'" name="'+key+'"/>'; 
    } 
} 

let url = "some payment gateway url" 
let payScript = "var form = document.getElementById('ts-app-payment-form-redirect'); "; 
payScript += "form.innerHTML = '" + formHtml + "';"; 
payScript += "form.action = '" + url + "';"; 
payScript += "form.method = 'POST';" ; 
payScript += "form.submit();" ;

öffnen Sie das inappbrowser und das Skript ausführen, indem ExecuteScript Methode von inappbrowser auf loadstop Ereignis

if (this.platform.is('cordova')) { 
    let browser = new InAppBrowser('redirect.html', '_blank', 'location=no'); 
    browser.show(); 
    browser.on("loadstart") 
    .subscribe(
     event => { 
     console.log("loadstop -->",event); 
     if(event.url.indexOf("some error url") > -1){ 
     browser.close(); 
     this.navCtrl.setRoot(BookingDetailPage,{ 
      success:false 
      }); 
     } 
     }, 
     err => { 
     console.log("InAppBrowser loadstart Event Error: " + err); 
    }); 
    //on url load stop 
    browser.on("loadstop") 
    .subscribe(
     event => { 
      //here we call executeScript method of inappbrowser and pass object 
      //with attribute code and value script string which will be executed in the inappbrowser 
      browser.executeScript({ 
       code:payScript 
      }); 
     console.log("loadstart -->",event); 
     }, 
    err => { 
     console.log("InAppBrowser loadstop Event Error: " + err); 
    }); 
    //on closing the browser 
    browser.on("exit") 
    .subscribe(
    console.log("exit -->",event); 
    }, 
    err => { 
    console.log("InAppBrowser loadstart Event Error: " + err); 
    }); 
}

ich getan habe, es so mit gepostet ich die versteckte Form mit Zahlungsdaten an das Zahlungs url mit dieser Methode . es funktioniert reibungslos. ich kann auch die inappbrowser url Änderungen in loadstart und loadstop Ereignisse prüfe ich den inappbrowser auf Erfolg oder Misserfolg Urls Sie

hoffe, das hilft clse kann .. :)

Quelle

2016-11-24 12:52:06

gut .. nicht funktioniert. App stürzt ab, wenn diese Seite geladen wird. –

seine Arbeit in meiner App, können Sie mir Ihren Code zeigen –

großen Dank, es rettete mich eine Menge Zeit –

ionische 2 inappbrowser POST Form mit Daten params

Antwort

Verwandte Themen