When I don’t need to verify the buyer this works great. But I don’t understand how to add the verify buyer function. Can anyone complete the below to include verify buyer function please, so that I can send the verification token and payment token to the api.
<head>
<title>HTML Button Generator</title>
<style>
button {
color: #003012;
background-color: #ffffff;
font-size: 19px;
font-family: georgia;
border: 3px solid #efa817;
border-radius: 50px;
padding: 15px 50px;
cursor: pointer;
}
button:hover {
color: #003012;
background-color: #efa817;
}
</style>
<link rel="stylesheet" href="/reference/sdks/web/static/styles/code-preview.css" preload>
<script src="https://web.squarecdn.com/v1/square.js"></script>
</head>
<body>
<div id="payment-form">
<div id="payment-status-container"></div>
<div id="card-container"></div>
<button id="card-button" type="button">Charge</button>
</div>
<script type="module">
const payments = Square.payments('redacted', 'redacted');
const card = await payments.card();
await card.attach('#card-container');
const cardButton = document.getElementById('card-button');
cardButton.addEventListener('click', async () => {
const statusContainer = document.getElementById('payment-status-container');
try {
const result = await card.tokenize();
if (result.status === 'OK') {
// window.parent.postMessage(result,"redacted");
window.parent.postMessage(result,"*");
statusContainer.innerHTML = "Payment Successful";
} else {
let errorMessage = `Tokenization failed with status: ${result.status}`;
window.parent.postMessage(result.status,"redacted")
if (result.errors) {
errorMessage += ` and errors: ${JSON.stringify(
result.errors
)}`;
}
throw new Error(errorMessage);
}
} catch (e) {
console.error(e);
statusContainer.innerHTML = "Payment Failed";
}
});
</script>
</body>
