Google : Ionic 2应用程序中的意外开发错误

Question

我正在使用在Ionic应用程序中集成google，我正在运行脚本，因为that.The脚本链接在浏览器中很好地工作，但是当我通过IN-APP浏览器打开应用程序中的这个链接时，它给了我意想不到的开发者错误。我非常精疲力竭，但没有得到的原因，通过应用.Please帮助我。这里是我在应用程序浏览器代码中的类型记录：

 var url = "https://mypaymenturl/googlepay/googlepay.html?price=0.01"
    var a: any; var b: any; var c: any;
    var target = '_self'
    var options = {location: 'no'};
    var browser = this.iab.create(url, '_blank', {location: 'no'});
            browser.on('loadstart').subscribe((e) => {
        console.log(e);
        let url = e.url;
        console.log(e.url);

    }, err => {
        console.log("InAppBrowser loadstart Event Error: " + err);
    });

这里是使用IN：(URL Script:https://mypaymenturl/googlepay/googlepay.html?price=0.01) )打开的链接后面运行的脚本。

<div id="container">
</div>`<script>
var allowedPaymentMethods = ['CARD', 'TOKENIZED_CARD'];
var allowedCardNetworks = ['AMEX', 'DISCOVER', 'JCB', 'MASTERCARD', 'VISA'];
var tokenizationParameters = {
    tokenizationType: 'PAYMENT_GATEWAY',
    parameters: {
        'gateway': 'stripe',
        'stripe:version': "5.1.0",
        'stripe:publishableKey': 'pk_test_b2gp9tSHK9iP****'

    }
}
function getGooglePaymentsClient() {
    return (new google.payments.api.PaymentsClient({environment: 'TEST'}));
}
function onGooglePayLoaded() {
    var paymentsClient = getGooglePaymentsClient();
    paymentsClient.isReadyToPay({allowedPaymentMethods: allowedPaymentMethods})
            .then(function (response) {
                if (response.result) {
                    prefetchGooglePaymentData();
                }
            })
            .catch(function (err) {
                console.error(err);
            });
}
function addGooglePayButton() {
    var button = document.createElement('button');
    button.className = 'google-pay';
    button.appendChild(document.createTextNode('Google Pay'));
    button.addEventListener('click', onGooglePaymentButtonClicked);
    document.getElementById('container').appendChild(button);
}
function getGooglePaymentDataConfiguration() {
    return {
        paymentMethodTokenizationParameters: tokenizationParameters,
        allowedPaymentMethods: allowedPaymentMethods,
        cardRequirements: {
            allowedCardNetworks: allowedCardNetworks
        }
    };
}
function getGoogleTransactionInfo() {
    var url = new URL(window.location.href);
    var price = url.searchParams.get("price");
    console.log(price);
    return {
        currencyCode: 'USD',
        totalPriceStatus: 'FINAL',
        totalPrice: price
    };
}
function prefetchGooglePaymentData() {
    var paymentDataRequest = getGooglePaymentDataConfiguration();
    console.log(paymentDataRequest);
    var url = new URL(window.location.href);
    var price = url.searchParams.get("price");
    console.log(price);
    paymentDataRequest.transactionInfo = {
        totalPriceStatus: 'FINAL',
        currencyCode: 'USD',
        totalPrice: price
    };
    var paymentsClient = getGooglePaymentsClient();
    paymentsClient.prefetchPaymentData(paymentDataRequest);
    onGooglePaymentButtonClicked();
}
function onGooglePaymentButtonClicked() {
    console.log("vikrant");
    var paymentDataRequest = getGooglePaymentDataConfiguration();
    console.log(paymentDataRequest);
    paymentDataRequest.transactionInfo = getGoogleTransactionInfo();
    var paymentsClient = getGooglePaymentsClient();
    console.log(paymentsClient);
    console.log("paymentsClient");
    paymentsClient.prefetchPaymentData(paymentDataRequest);
    paymentsClient.loadPaymentData(paymentDataRequest)
            .then(function (paymentData) {
                console.log("Handle the response");
                console.log(paymentData);
                processPayment(paymentData);
            })
            .catch(function (err) {
                console.log("show error in developer console for debugging");
                console.error(err);
                window.history.replaceState(null, null, "?param=error");
            });
}
function processPayment(paymentData) {
    var data = JSON.parse(paymentData.paymentMethodToken.token)
    window.history.replaceState(null, null, "?param=success&token=" + data.id + "&card=" + data.card.id);}</script>`
<script async   src="https://pay.google.com/gp/p/js/pay.js"onload="onGooglePayLoaded()"></script>

Answer 1

您正在使用的只能在网络混合应用程序上使用，或者不支持从本地应用程序中的WebView调用它。

如果您想在混合应用程序中使用Google，您必须从本地Java代码调用Google。在Ionic中这样做的方法是构建一个Cordova插件，然后通过离子原生调用它。按照谷歌付费Android教程的实际代码在插件中使用。