paypal checkout button get json response in javascript

Question

In the paypal API reference page it says after creating a payment it will return a response. I would like to use the transaction information after payment is completed, but I'm not sure how to obtain this response json from the basic integration scenario here . After going through the documentation, I don't see where I can get this response. Am I missing a missing a option here? Thanks in advance.

The following is my code

paypal.Button.render({

    // Set your environment

    env: 'sandbox', // sandbox | production

    // Pass the client ids to use to create your transaction on sandbox and production environments

    client: {
        sandbox:    'removed for security', // from https://developer.paypal.com/developer/applications/
        production: 'removed for security'  // from https://developer.paypal.com/developer/applications/
    },

    // Pass the payment details for your transaction
    // See https://developer.paypal.com/docs/api/payments/#payment_create for the expected json parameters

    payment: function() {
        return paypal.rest.payment.create(this.props.env, this.props.client, {
            transactions: [
                {
                    amount: {
                        total:    total,
                        currency: 'USD'
                    },
                    custom: purchaseOrderNumber
                }
            ]
        });
    },

    // Display a "Pay Now" button rather than a "Continue" button

    commit: true,

    // Pass a function to be called when the customer completes the payment

    onAuthorize: function(data, actions) {
        console.log("data", data);
        console.log("actions", actions);
        return actions.payment.execute().then(function() {
            console.log('The payment was completed!');

            //use transaction information from json response here
        });
    },

    // Pass a function to be called when the customer cancels the payment

    onCancel: function(data) {
        console.log('The payment was cancelled!');
    }

}, '#paypal-button');

EDIT:

console results for data

{

"paymentToken":"EC-8T213183GM917341N",
"payerID":"784ARKSZGWBPG",
"paymentID":"PAY-00M809553A479072XLEBN4RI",
"intent":"sale",
"returnUrl":"https://www.sandbox.paypal.com/?paymentId=PAY-00M809553A479072XLEBN4RI&token=EC-8T213183GM917341N&PayerID=784ARKSZGWBPG"

}

console results for actions

{
    "payment":{}
}
//see below for console screenshot

EDIT2:

request to paypal framework and response

It would appear that The last picture is the response that I actually need. Is there a way to obtain this data from a basic paypal button?

Answer 1

Add a parameter to actions.payment.execute().then() to catch the response

paypal.Button.render({

    // Set your environment

    env: 'sandbox', // sandbox | production

    // Pass the client ids to use to create your transaction on sandbox and production environments

    client: {
        sandbox:    'removed for security', // from https://developer.paypal.com/developer/applications/
        production: 'removed for security'  // from https://developer.paypal.com/developer/applications/
    },

    // Pass the payment details for your transaction
    // See https://developer.paypal.com/docs/api/payments/#payment_create for the expected json parameters

    payment: function() {
        return paypal.rest.payment.create(this.props.env, this.props.client, {
            transactions: [
                {
                    amount: {
                        total:    total,
                        currency: 'USD'
                    },
                    custom: purchaseOrderNumber
                }
            ]
        });
    },

    // Display a "Pay Now" button rather than a "Continue" button

    commit: true,

    // Pass a function to be called when the customer completes the payment

    onAuthorize: function(data, actions) {

        return actions.payment.execute().then(function(param) {
            console.log('The payment was completed!');

            //param is the json response
        });
    },

    // Pass a function to be called when the customer cancels the payment

    onCancel: function(data) {
        console.log('The payment was cancelled!');
    }

}, '#paypal-button');

Answer 2

The setup seems all good, all you need now is to decide what and how you want to handle your response.

In the onAuthorize function you can do something like ( github paypal checkout button ) this for all of your aproved sales (check for data.status to be approved (credit card) or created (for payment with paypal), then you should have a data.payer with all the info):

jQuery.post('/my-api/execute-payment', { paymentID: data.paymentID, payerID: data.payerID });
            .done(function(data) { /* Go to a success page */ })
            .fail(function(err)  { /* Go to an error page  */  });

or use directly the data json object in the function.