I am trying to integrate the client side PayPal JavaScript SDK with the PayPal server side REST API.
I know how to create a new PayPal order in both the client side JavaScript SDK and the server side REST API. I have successfully done both. But the problem is, that regardless of which way I do it, there is a problem. If I create a new order on the server, but not in the client code, then the price shown after the customer logs in, is 0.01 cent, instead of the correct price, even though the order was created correctly.
I could use BOTH the client side createOrder
method AND the server side order creation, but my concern is that it will create two orders, and maybe even CAPTURE two payments.
I can’t find a way to integrate the server side order creation AND set the price in the PayPal dialog that appears after the user logs in.
How do I get the product price to show up after the user has logged in without using the client side createOrder
method?
If I create an order on the server and pass the order ID back to the client code, the client side JavaScript API has 3 errors about PATCH. Which I do not understand.
I can leave out the client side createOrder
method and everything works except that the payment amount defaults to 0.01 cent. I don’t want that.
Client code:
function thePromiseCode() {
return new Promise (function (resolve,reject) {
google.script.run
.withSuccessHandler (function (result) {
resolve (result);//What resolve does is return the result from the server back to the FIRST anonymous function in the "then" part
})
.withFailureHandler (function (error) {
reject (error);
})
.createA_PayPalOrder();//Call the server to create a PayPal order
})
}
function initPayPalButton() {
thePromiseCode()// Call the server code to create an order
.then(
function(response) {
console.log('response 89: ' + response)
var orderObj = JSON.parse(response);
window.payPalOrderId = orderObj.id;
console.log('payPalOrderId: ' + payPalOrderId)
},
function (error) {
showModalMessageBox("There was an error in the PayPal button!","ERROR!");
console.log(error);
return "Error";
}
);
paypal.Buttons({
style: {
shape: 'rect',
color: 'gold',
layout: 'vertical',
label: 'paypal',
},
createOrder: function(data, actions) {
// This fnc sets up the details of the transaction, including the amount
return actions.order.create({
purchase_units:[
{"description":"My Product Name",
"amount":{
"currency_code":"USD",
"value":"2.95",
}
}
]
});
},
onApprove: function(data, actions) {
return actions.order.capture().then(function(details) {
payPalPaymentComplete();
console.log('Transaction completed by ' + details.payer.name.given_name + '!');
});
},
onCancel: function (data, actions) {
// Show a cancel page or return to cart
showModalMessageBox('PayPal Session was cancelled',"CANCELLED!");
backToStartPay();
},
onError: function(err) {
showModalMessageBox("There was an error in the PayPal button!","ERROR!");
console.log(err);
}
}).render('#paypal-button-container');
}
initPayPalButton();
</script>
2
Answers
Here is my solution for using both the client side PayPal Javascript SDK and the server side PayPal API to accept a payment from the buyer. This server code is specific to Apps Script, and the server call from the client side is also specific to Apps Script.
NOTE: To go "live" you must:
Server Code - Apps Script
Client Side HTML
Client Side JavaScript
You’ll need to provide more details about this issue as it seems this is what you need help with.
The correct way to call your server is shown in this sample: https://developer.paypal.com/demo/checkout/#/pattern/server
The use of
actions.order.create()
and.capture()
must be completely avoided.