Payerurl API Integration using JavaScript
# Send payment request:
<!DOCTYPE html>
<html>
<head>
<title>Javascript integration</title>
<script src=”https://cdnjs.cloudflare.com/ajax/libs/crypto-js/4.1.1/crypto-js.min.js”> </script>
<script src=”https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.3/jquery.min.js”> </script>
</head>
<body>
<h1>Loading….</h1>
</body>
<script>
let invoiceid = 12345;
let amount = 123;
let currency = ‘usd’;
let billing_fname = ‘First name’;
let billing_lname = ‘Last name’;
let billing_email = ‘[email protected]’;
let redirect_to = ‘https://www.test.com/checkout/order-pay/1234/?key=wc_order_nBSBH9A6wuFnk’;
let notify_url = ‘https://www.test.com/wc-api/wc_payerurl’;
/**********Do not share the credentials*********/
// get your API key : https://dashboard.payerurl.com/profile/api-management
let payerurl_secret_key = ‘bd8d7cd729—demo—6ce19d78076’;
let payerurl_public_key = ‘b14cfda7—demo—57568f24a2bd’;
/***********************************************/
let args = {
order_id: invoiceid,
// [required field] [String] [Merchant order ID/ Invoice ID]
amount: amount,
// [required field] [String] [Price of the product]
currency: currency ? currency.toLowerCase() : ‘usd’,
// [required field] [String] [Currency of the price of the product]
billing_fname: billing_fname ? billing_fname : ‘undefined’,
// [Optional field] [String] [Customer billing first name]
billing_lname: billing_lname ? billing_lname : ‘undefined’,
// [Optional field] [String] [Customer billing last name]
billing_email: billing_email ? billing_email : ‘undefined’,
// [Optional field] [String] [Customer billing email]
redirect_to: redirect_to,
// [required field] [String] [After making a purchase, go back to the merchant’s website endpoint]
notify_url: notify_url,
// [required field] [String] [After making a purchase, send notification with payment details]
type: ‘purl’,
// [required field] [String] [The way of the customer request]
};
let keys = Object.keys(args).sort();
let sorted_args = {};
for (let i = 0; i < keys.length; i++) {
sorted_args[keys[i]] = args[keys[i]];
}
let query = new URLSearchParams(sorted_args).toString();
let signature = CryptoJS.HmacSHA256(query, payerurl_secret_key);
//[required field] [Merchant secret key]
let authStr = btoa(payerurl_public_key + ‘:’ + signature);
//[required field] [Merchant public key]
//var_dump($authStr);
let xhr = new XMLHttpRequest();
xhr.open(‘POST’, ‘https://dashboard.payerurl.com/api/payment’, true);
xhr.setRequestHeader(‘Content-Type’, ‘application/x-www-form-urlencoded;charset=UTF-8’);
xhr.setRequestHeader(‘Authorization’, ‘Bearer ‘ + authStr);
xhr.onload = function() {
if (xhr.readyState === xhr.DONE && xhr.status === 200) {
let response = JSON.parse(xhr.responseText);
if (response.redirectTO) {
window.location.replace(response.redirectTO);
}
}
};
xhr.send(query);
</script>
</html>
