dpa99c / cordova-plugin-inappbrowser-popup-bridge

A fork of cordova-plugin-inappbrowser which adds Braintree's PopupBridge functionality to support PayPal payments
Apache License 2.0
22 stars 18 forks source link

Ionic Issue #1

Closed honey93 closed 7 years ago

honey93 commented 7 years ago

I installed your plugin cordova plugin add cordova-plugin-inappbrowser-popup-bridge

Then I initialized in main.js file :

document.addEventListener("deviceReady",function(){

  window.open = cordova.InAppBrowser.open;

});

In html used it like:

<div id="myContainerElement"></div>

In controller file I used it:

paypal.Button.render({

    env: 'sandbox', // Optional: specify 'sandbox' environment

    client: {
        sandbox:    'XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX',
        production: 'xxxxxxxxx'
    },

    payment: function() {

        var env    = this.props.env;
        var client = this.props.client;

        return paypal.rest.payment.create(env, client, {
            transactions: [
                {
                    amount: { total: vm , currency: 'USD' }
                }
            ]
        });
    },

    commit: true, // Optional: show a 'Pay Now' button in the checkout flow

    onAuthorize: function(data, actions) {

        // Optional: display a confirmation page here
        $scope.payment = false;

        return actions.payment.execute().then(function() {
            // Show a success page to the buyer
            $scope.payment = false;
        });
    },

    onCancel: function(data) {
        console.log('The payment was cancelled!');
        //$scope.payment = false;
        $scope.$apply();
    }

}, '#myContainerElement');

Still the paypal button is not getting displayed on click of button, could you please help me out:

dpa99c commented 7 years ago

I believe you won't be able to host the page containing the Paypal Checkout code within the app - it will fail the CORS checks on the PayPal servers (if you inspect the JS console in the IAB Webview, you'll see a bunch of security errors). The page must be hosted on a server, and that URL opened from within the InappBrowser.

I've created a branch of the demo project: https://github.com/dpa99c/cordova-plugin-inappbrowser-popup-bridge-test/tree/paypal-checkout

It uses a test page hosted on my server: http://demos.workingedge.co.uk/iab.html

Try cloning and running the test project:

git clone https://github.com/dpa99c/cordova-plugin-inappbrowser-popup-bridge-test#paypal-checkout
cordova platform add android
cordova run android