NextJS local image file not showing in Firefox

Support
1

Hi guys

So here’s my site: https://relaxed-heisenberg-856d61.netlify.app/
Basically, I’ve just started using netlify and have deployed my NextJS site. To my surprise, on Firefox, the site logo (situated on the top left) doesn’t load. When checking the console, it appears that the image (which is stored in the public folder which Next uses for static assets) is being loaded using HTTP and not HTTPs. When I click on the image, however, it takes me to an HTTPs link. I’m not sure why this is happening at all. I’ve attached images for you to see. Note that I’ve tried this on Safari and the image loads just fine.

Screen Shot 2021-06-19 at 20.54.44
Screen Shot 2021-06-19 at 20.54.442158×92 20.2 KB

(I’d love to post more images but I can only post one)

Thanks ahead!

2

Hi @wasurocks

Welcome to the Netlify community.

Try changing the image URL (and any other URLs for CSS, JS, images) to https. The error is because you are trying to load a http resource when your site uses HTTPS.

3

Hey, thanks for answering!

The problem is the image is a local image stored in the public folder of the site and not external. Would I still be able to controll the https header in that case?

1 Like
4

There was a recent post along similar lines. The solution seemed to revolve around the lack of support in next/image for SVG.

However there are posts (such as below) that would suggest otherwise

1 Like
5

Thank you so much! I really appreciate your help :slight_smile:

2 Likes