I'm using a third party CRM application which allows you to build web forms using drag and drop widgets and the ability to add javascript code to manipulate those widgets.
I need to build a form to take payments using another third party payment gateway.
The basic process is as follows:
- customer selects products on the form.
- I use inline javascript to work out the total cost.
- customer submits form which generates a case ref number
- upon the submit event i use javascript to create a payment basket using the payment gate way api and upon successful creation I redirect user to the payment gateway to make payment.
My question is when i create the payment basket using the payment gateway api, i send the json payload including the total to pay using javascript. e.g.
var total = 100;
var ref = 123456;
$.ajax({
url: 'paymentgatewaycreatebasketurl',
dataType: 'json',
type: 'post',
contentType: 'application/json',
data: JSON.stringify( { "Ref": ref, "PaymentAmount": total, "Quantity": 1, ... } ),
processData: false,
success: function( data, textStatus, jQxhr ){
// redirect user to paymentgateway payment page using returned token and basket ref.
},
error: function( jqXhr, textStatus, errorThrown ){
console.log( errorThrown );
}
});
Is it possible for a malicious user to edit the javascript and change the total amount e.g. using chrome dev tools etc?
What are the implications of doing it this way and is there a more secure method to prevent users from editing the total to pay?
I'm unable to define the total on the server side due to limitations of the CRM product hence having to do it using javascript.