Maxqueue
Maxqueue

Reputation: 2444

Add Authorize.net merchant seal to react app

I added my domain to authorize my web app to show the Authorize.net merchant seal. The seal is not showing and haven't found any examples of how to implement this in react.

I have the following implemented:

useEffect(() => {
  // Create the Authorize.Net script dynamically
  const sealScript = document.createElement("script");
  sealScript.type = "text/javascript";
  sealScript.src = "//verify.authorize.net:443/anetseal/seal.js";

  // Create the customer ID script
  const customerIdScript = document.createElement("script");
  customerIdScript.type = "text/javascript";
  customerIdScript.text = `var ANS_customer_id="";`;

  // Append the scripts to the Authorize.Net container
  const sealContainer = document.querySelector(".AuthorizeNetSeal");
  if (sealContainer) {
    sealContainer.appendChild(customerIdScript);
    sealContainer.appendChild(sealScript);
  }
}, []);

<Box textAlign="center" mt={2} mb={2}>
  <div className="AuthorizeNetSeal"></div>
</Box>

Upvotes: 0

Views: 25

Answers (0)

Related Questions