Images in stored in AWS S3 not loading in Chrome but work in Firefox

Question

I am hosting static files for a Django web application in AWS S3 using the Python storages package.

The application's static assets load in Firefox, but in Chrome, the image files will not load. I am running the local Django development server.

The error I am getting for the image file is:

Access to XMLHttpRequest at 'https://bucket.s3.amazonaws.com/static/svg/parts/part1.svg' from origin 'http://127.0.0.1:8000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

My cors configuration for the AWS bucket is the following:

<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
<CORSRule>
    <AllowedOrigin>*</AllowedOrigin>
    <AllowedMethod>GET</AllowedMethod>
    <MaxAgeSeconds>3000</MaxAgeSeconds>
    <AllowedHeader>*</AllowedHeader>
</CORSRule>
</CORSConfiguration>

I am only having issues with the image files. JavaScript, CSS, and webfont files (Fontawesome) are all loading fine in Chrome, it's just .svg and .png files that aren't loading and that I am getting the error for.

All of this works fine in Firefox with all images loading from AWS S3. I have tried the following settings in Django:

AWS_S3_SECURE_URLS = True

AWS_S3_SECURE_URLS = False

I have verified the the URLs in the browser are rendering as either http or https depending on the boolean value. Neither of these settings makes a difference in Chrome.

I am using the corsheaders package in Django and have the following set in settings.py:

CORS_ORIGIN_ALLOW_ALL = True

This appears to be a known issue with Chromium and WebKit browsers, but there isn't much information beyond what I have already tried to get this to work.

I would appreciate and suggestions. Thanks!