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.