Overlay on map not drawing properly, is this a cache issue? - caching

Question

The site in question is multi.reindicator.com
We have market and neighborhood overlays using Carto, but many users experience an issue where the overlays don't show up properly. This is sometimes resolved when clearing browser cache, but a lot of our members are older and would never be able to figure out how to do that on their own.
Issue is, I can't figure out how o resolve this problem. I can't find anything in the code that appears to be causing this, so I feel like it may just be the way Carto handles our data.
You can see an example map error here: https://i.stack.imgur.com/CeBIg.png
Original map looks like this: https://i.stack.imgur.com/dXpeI.png
I can't think of anything else to try. All browser experience this issue to some extent, and clearing cache does resolve is most of the time, but the browser needs to be quit and reopened.
It uses mapbox for the basemap and Carto for overlays. It "usually" works well but often the overlays are partially rendered. According to the network flow (inspector), some requests response "status: bad -> 'Bad Request'"
Here is a part of the har file:
{
"startedDateTime": "2019-08-20T17:13:04.505Z",
"time": 121.74399999639718,
"request": {
"method": "GET",
"url": "https://cartocdn-gusc.global.ssl.fastly.net/reindicator/api/v1/map/reindicator#3b077a09#c3615dde7e9d26d95c813667bde38147:1545364448004/1/13/1878/3146.png",
"httpVersion": "http/1.1",
"headers": [
{
"name": "Sec-Fetch-Mode",
"value": "no-cors"
},
{
"name": "Referer",
"value": "https://multi.reindicator.com/"
},
{
"name": "DNT",
"value": "1"
},
{
"name": "User-Agent",
"value": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/76.0.3809.100 Safari/537.36"
}
],
"queryString": [],
"cookies": [],
"headersSize": -1,
"bodySize": 0
},
"response": {
"status": 400,
"statusText": "Bad Request",
"httpVersion": "http/1.1",
"headers": [
{
"name": "Access-Control-Allow-Origin",
"value": "*"
},
{
"name": "Access-Control-Allow-Headers",
"value": "X-Requested-With, X-Prototype-Version, X-CSRF-Token, Authorization"
}
],
As you can see above, the response status is 400.
If anyone has any idea how I can resolve this issue so the users don't experience this partial drawing issue of the overlays and don't need to clear their cache constantly, I'd really appreciate any tips.