Issues with Cloudflare and Sagicor Payment Gateway

The aim of this post is to create a list of issues and solutions developers came across when implementing Sagicor’s Payment Gateway.

No Lightbox Modal is shown.

If you’ve correctly implemented the Sagicor payment gateway and the payment gateway isn’t shown on the checkout page, it could be one of the following reasons.

1. There’s a broken plugin or JavaScript file

Open the browser console (Inspect Element → Click on Console tab) and check if there is any JavaScript error. If there are, you probably need to look for the plugin that is causing the JS breakage and either update or disable it.

If you can’t figure out the issue, let us know in the comments below.

2. Caching

At times, JS and other static files are cached and your changes haven’t been reflected on your site.

Solution:
Clear your browser cache, server cache and even Cloudflare cache.

3. Cloudflare or your firewall is blocking external resources

The Sagicor payment gateway is using an iframe for the modal. The server and Cloudflare HTTP headers may be blocking the iframe and external static files.

Solution:
Ensure that you’re using the current HTTP headers. See WordPress Security Headers needed for Payment Gateways for more information.

Continuing the discussion from Accepting payments via Sagicor wooCommerce Plugin in Jamaica (Presentation):

Also, If you’re using Cloudflare and the Ligthbox Modal is shown for the payment gateway, you may also want to check the you have Rocket Loader enable.

If you do, turn if off, it’s an advance caching tool that reduces the render time of the site via Cloudflare.

Symtopms

  • There are no JS errors shown in the console
  • The security headers are correct
  • The page is saying waiting to load payment page, but no modal is shown.

Steps

  • Log into Cloudflare and go to your domain.
  • Click on the Speed Tab, then click on the Optimization sub-tab
  • Scroll down and turn off Rocket Loader.

Here’s an how to: Cloudflare Rocket Loader Conflict | Mediavine Help Center