Javascript expert required

I need an expert in javascript to help me with a piece of code. Basically i need to generate a uuidv4 and pass it to the tx_ref parameter in makePayment function please see both functions below it needs to be done dynamically everytime the page loads.



function uuidv4() {
return ([1e7]+-1e3+-4e3+-8e3+-1e11).replace(/[018]/g, c =>
(c ^ crypto.getRandomValues(new Uint8Array(1))[0] & 15 >> c / 4).toString(16)
);
}

console.log(uuidv4());

<script src="https://checkout.flutterwave.com/v3.js"></script>
<form>
<div>
Your order is ₦54,600
</div>
<button type="button" id="start-payment-button" onclick="makePayment()">Pay Now</button>
</form>
<script>
function makePayment() {
FlutterwaveCheckout({
public_key: "FLWPUBK_TEST-SANDBOXDEMOKEY-X",
tx_ref: "titanic-48981487343MDI0NzMx",
amount: 54600,
currency: "NGN",
payment_options: "card, banktransfer, ussd",
redirect_url: "https://glaciers.titanic.com/handle-flutterwave-payment",
meta: {
consumer_id: 23,
consumer_mac: "92a3-912ba-1192a",
},
customer: {
email: "roseunsinkableship.com",
phone_number: "08102909304",
name: "Rose DeWitt Bukater",
},
customizations: {
title: "The Titanic Store",
description: "Payment for an awesome cruise",
logo: "https://www.logolynx.com/images/logolynx/22/2239ca38f5505fbfce7e55bbc0604386.jpeg",
},
});
}
</script>