question

I am having issues adding a hosted iframe onto my site. I am able to generate payments via Postman using my sites form using the clv... but I receive an error when running via Chrome

Error:

Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

Form:

<form action="process_payment.php" method="post" id="payment-form">

process_payment.php:

<?php

if ( $_SERVER['REQUEST_METHOD'] == 'POST' ) {
    $source = $_POST['cloverToken'];
}

?>
<script src="https://code.jquery.com/jquery-3.4.1.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script>
<script type="text/javascript">
const data = JSON.stringify({
  "ecomind": "ecom",
  "amount": 176.00,
  "currency": "usd",
  "source": "<?php echo $source; ?>"
});

const xhr = new XMLHttpRequest();

xhr.addEventListener("readystatechange", function () {
  if (this.readyState === this.DONE) {
    console.log(this.responseText);
  }
});

xhr.open("POST", "https://scl-sandbox.dev.clover.com/v1/charges/");
xhr.setRequestHeader("Accept", "application/json");
xhr.setRequestHeader("Content-Type", "application/json");
xhr.setRequestHeader("Authorization", "Bearer 4c..............................");

xhr.send(data);
</script>

What am I missing? Could anyone help? Thanks in advanced!