Error accessing images

I have a ton of images of different markers I show on a map. Everything was working great, but now some of the images won’t show on my map. I think this is some kind of security issue, and it might have been caused by some Privacy rules I set up due to a Flusk report I ran.

Debugger is saying Element MapBox A: Failed to load marker image. Try a valid image!

Inspect in Chrome is showing. https://14d12bedba1693a6fafab91b6c21c10f.cdn.bubble.io/f1742939998030x290323622960503740/Group%202611333.png’ from origin ‘https://yardpro.com’ has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. If an opaque response serves your needs, set the request’s mode to ‘no-cors’ to fetch the resource with CORS disabled.

When I look in the File Manager, some files have a USER ID of edit_mode while others have what looks like a unique ID. I have found that if I remove a file that has a Unique ID and then reupload it, the image shows.

I think this is a Privacy Rule issue but I’ve tried to back out the new privacy rules I implemented and still no luck.

Really appreciate the help!

We can’t solve this without more info.
One thing I would say is to test in a different browser or browser profile, because your browser will still display images that it has loaded before and/or cached, which might be why some of the images are showing and others are not.

Again, testing with newly created data (in your case files) is important as well to make sure the current privacy rules settings work with current (not old) data.

It’s very inconsistent When I view on web, I see some icons, on mobile I see all icons, in native (BDK) wrapped all I see a different set of icons, but not all. I’m thinking this might have to do with the plugin because if I just try to display all the images on a page, they all show. They just don’t show when showed in the MapBox plugin. That being said, I feel like it could have something to do with privacy settings in Bubble.

It’s frustrating when you get seemingly inconsistent behaviours like this, so try to simplify the problem e.g. create a small “debug” style screen and see if you can replicate the issue consistently without the noise of the full app.

The clue from your first message is that everything was fine, until you implemented the privacy rule recommendation from Flusk.

If that is an accurate statement, then you are correct that the issue is to do with privacy rules.
Sorry that sounds obvious but if that’s true, then you just need to approach it from that angle.

We can help you debug if you want.

Oh and another thing - we had a similar issue on another project just today when we changed a file from public to private.

We could download a private file in one page workflow, but not from the same workflow on a different page, citing the CORS error. It seemed to relate to whether Bubble was referring directly to the CDN or to original file with the access token in the URL. We asked Bubble for support but didn’t get a solution. If it’s the same issue as ours, you could just make the map marker images public if they don’t contain sensitive customer data.

Hi Will, really appreciate your help on this! When you say make an image public, what do you mean by that? In File Manager I don’t see where files are marked as private or public. I do see the UserID field which I’m not sure how it’s populated and I think the ID in there is what’s causing the issue.