Upgrade insecure requests in the Admin Panel for Firefox

Questions and Answers Strapi Admin
1

Hi,

I have a Strapi instance running in a HTTPS domain (https://www.mystrapisite.com), but I have my image files hosted on a MinIO (S3 compatible) object storage in a HTTP domain (http://www.mys3storage.com).

When I installed the Strapi S3 Provider to let me upload files to my S3 object storage, I followed the instructions to update the file middleware.ts so the images in the Admin Panel’s Media Library could be loaded from an external domain. So I did this change in the file:

{
    name: 'strapi::security',
    config: {
        contentSecurityPolicy: {
            useDefaults: true,
            directives: {
                'connect-src': ["'self'", 'https:'],
                'img-src': ["'self'", 'data:', 'blob:', 'dl.airtable.com', 'mys3storage.com'],
                'media-src': ["'self'", 'data:', 'blob:', 'dl.airtable.com', 'mys3storage.com'],
            },
        },
    },
},

And this has worked fine on Chrome. When I login the Admin Panel and I upload images to my S3 storage I can see the images in the Media Library after the upload, but again, only on Chrome. I cannot see the images if I use Firefox.

The URLs to the images in my S3 storage use HTTP, but when the Admin Panel is loaded Chrome automatically upgrade these insecure URLs to HTTPS and they still work. However Firefox doesn’t seem to be doing the same. The only way to make Firefox display the images is if I disable CSP entirely, like this:

{
    name: 'strapi::security',
    config: {
        contentSecurityPolicy: false
    },
},

But I would rather not disable CSP. Since the initial configuration seems to be working fine with Chrome, I wonder if there’s something else that I could do to make it display the images for Firefox as well.

Thanks in advance for helping.

System Information
  • Strapi Version: 4.3.2
  • Operating System: Linux
  • Database: Postgres
  • Node Version: 14
  • Yarn Version: 1.22.19