Back

Technologies:

javascriptjavascript
avatar
Tolerim
21 hours ago

There is a TypeError in production on AWS EC2 related to Squareup, stating that window.Square.payments is not a function.

Following the documentation, I've successfully integrated square payment into my Django project hosted on AWS EC2; however, I'm experiencing an error when loading the page which prevents the card section from appearing. Despite disabling cloudflare, the issue persists. Interestingly, the code runs flawlessly on localhost. Upon inspection, the error message reads: Uncaught (in promise) TypeError: window.Square.payments is not a function. Here's my implementation:

<script type="text/javascript" src="https://web.squarecdn.com/v1/square.js"></script>

<!-- Square payment scripts -->
<script>
  const appId = "{{APPID}}";
  const locationId = "{{LOCATIONID}}";

   document.addEventListener('DOMContentLoaded', async function () {
    if (!window.Square) {
      throw new Error('Square.js failed to load properly');
    }

    const payments = window.Square.payments(appId, locationId); // The error occurs at this point
    ...
    }
Answers(1)
avatar
Tolerim
21 hours ago
Verified Answer
The error message "Uncaught (in promise) TypeError: window.Square.payments is not a function" indicates that the window.Square.payments function is not defined or loaded properly in your code. Here are some steps you can take to resolve the issue: 1. Make sure that you have included the https://web.squarecdn.com/v1/square.js script in your HTML file before your own script that uses window.Square.payments. 2. Verify that the APPID and LOCATIONID variables have the correct values. 3. Check if there are any errors in the browser console that might help you identify the root cause of the issue. 4. If you are using any ad-blocker or browser extension that blocks scripts, try disabling them and see if the issue persists. Also, make sure that you are running your Django project with HTTPS enabled since Square payments require a secure connection.
;