Thumbnails no longer loading

Resolved dragonstorm75
(@dragonstorm75)

3 months ago

Hello Foogallery team, thanks very much for a wonderful plugin!

Within the last two days I noticed that thumbnails no longer load and the following errors show up in the Inspect panel:

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at [link to the image thumbnail not showing] (Reason: CORS header ‘Access-Control-Allow-Origin’ missing). Status code: 200.

Is there any way to allow CORS headers to whitelist foogallery and/or shortpixel? Alternatively is this a wider issue that’s being fixed and a patch will be available?

Thank you kindly,

Valerie

The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)

Plugin Support elviiso
(@elviiso)

3 months ago
Hi @dragonstorm75

What you’re encountering isn’t something that can be fixed by simply whitelisting the domain. The issue here stems from a CORS restriction.

Your site, https://dragonstormstudios.ca, is trying to load an image from https://cdn.shortpixel.ai. Even though ShortPixel is serving an optimized version of your own image, the browser treats these as two different origins. And because cdn.shortpixel.ai isn’t sending the required Access-Control-Allow-Origin header, the browser blocks the image from being displayed due to security restrictions.

The easiest solution is to ensure that the image is served from the same origin as your website. To do this:
1. Go to FooGallery → Settings → Images.
2. Set the Thumbnail Engine to “Default”.
3. Save your changes. Here’s a screenshot for reference: https://prnt.sc/2UK8IEvoEnVf
If you’d prefer to continue using cdn.shortpixel.ai, here are a few things you can explore:
- Option 1: Use a custom CDN domain (CNAME) Check if ShortPixel allows you to set up a custom subdomain like cdn.dragonstormstudios.ca that points to their CDN. This keeps everything under your domain, avoiding cross-origin issues.
- Option 2: Enable CORS headers Ask ShortPixel if they can send the Access-Control-Allow-Origin: https://dragonstormstudios.ca header with their image responses.
- Option 3: Bypass the CDN for specific images If the CDN can’t be configured, you could update the image src to load directly from your server instead of ShortPixel for this specific case. While this bypasses the optimization benefits for that image, it would resolve the CORS issue.
If none of the above works, I’d recommend reaching out to ShortPixel support or checking their documentation for steps on how to set CORS headers or configure your own domain as the image source.

Kind regards,
Elvis
Plugin Author bradvin
(@bradvin)

2 months, 3 weeks ago

hi @dragonstorm75

Did the issue get resolved when you upgraded to v3.1.1?

Thread Starter dragonstorm75
(@dragonstorm75)

2 months, 3 weeks ago

Hi @bradvin, oh my gosh the update worked! Yes!

Thank you so so much!!

Viewing 3 replies - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.

Tags