PayPal Smart Payment Buttons - validate shipping address before payment? - paypal

Question

PayPal allows adding a delivery address street without a number.
As far as I know, it is not possible to check this behavior during the order process before the payment is finished.
The order data is available in the onApprove function scope.
But that's too late, because the payment is finished then?
Is there a way to add address validation?
<script src="https://www.paypal.com/sdk/js?client-id=abc123&disable-funding=credit,card,sepa,giropay&currency=EUR"></script>
<script>
paypal.Buttons({
createOrder: function(data, actions) {
return fetch('/paypal/order/create/', {
method: 'post'
}).then(function(res) {
return res.json();
}).then(function(orderData) {
if (orderData.error)
{
return actions.reject();
}
return orderData.id;
});
},
onShippingChange: function(data, actions) {
if (data.shipping_address.country_code !== 'DE')
{
return actions.reject();
}
return actions.resolve();
},
onApprove: function(data, actions) {
return fetch('/paypal/order/' + data.orderID + '/capture/', {
method: 'post'
}).then(function(res)
{
return res.json();
}).then(function(orderData) {
let re = /[0-9]/;
// test
if (re.exec(orderData.payer.address.address_line_1) === null)
{
// cancle payment on this place is to late, because payment is finished
}
var errorDetail = Array.isArray(orderData.details) && orderData.details[0];
if (errorDetail && errorDetail.issue === 'INSTRUMENT_DECLINED') {
return actions.restart();
}
if (errorDetail)
{
return;
}
return fetch('/paypal/finish-order/' + data.orderID + '/',{
headers: {
'Content-Type' : 'application/json',
},
body: JSON.stringify(orderData),
method: 'post'
}).then(function(result){
let dat = result.json();
return dat;
}).then(function(data)
{
if (data.error)
{
actions.reject();
}
if (data.destination)
{
actions.redirect(data.destination)
}
});
});
},
funding: {
allowed: [ paypal.FUNDING.CARD ],
disallowed: [ paypal.FUNDING.CREDIT ]
},
style: {
size: 'medium',
height: 40,
label: 'checkout'
}
}).render('#ppbut');
</script>

Answer 1

When onApprove is called, the payment is not finished. The order still needs to be captured.
Before capture, you can show an order review step if desired (for the customer to verify a new total, for example, or select from available shipping methods). This step can be done by updating the DOM dynamically (a redirect can also work but is best avoided).
If the address is invalid, show an error message accordingly and give an option to restart; do not proceed with any capture. You do not need to void the order (there is no method), simply forget about that order id and never capture it.
You can patch the order to a new total as needed (automatically, or based on selections in the review step you add).
Finally, proceed with the capture as normal and show success.
If you do add a user review step after approval, you should also change the last button at PayPal to say "Continue" instead of the default "Pay Now" to match your behavior. This is only a text change, the behavior only changes based on what you do in onApprove, which must correspond. To make the text change, add an application_context object to the top level (not inside purchase_units) of your order creation request, in which you specify a user_action parameter with the value CONTINUE.