@erburaktr I may have run into a similar problem as you? I can describe the problem that I ran into and then describe my solution to that problem. If it helps, you can let me know.
Like you, I have a linux virtual machine on Digital Ocean that acts as my origin server. I also have a Digital Ocean Spaces bucket that I’m using to serve images. My domain.com, registered with Cloudflare, points to the Digital Ocean linux machine. Similarly, my sub.domain.com is a CNAME pointing to my S3 bucket. When I tried to load an <img> tag in domain.com that pointed to sub.domain.com, I got an error similar to the one you got.
From Cloudflare’s documentation, it seems like Cloudflare is smart enough to acknowledge the Host/Origin Request Headers and the Access-Control-Allow-Origin Response Header while it serves as a reverse proxy. So I went to
Digital Ocean > Spaces Object Storage > my-bucket-name > Settings > CORS Configurations > Add
For the origin field, I simply put https://domain.com. (Make sure to be clear about whether you’re expecting http or https. If you use only https, only add that. If you need both, add both.) And I only enabled GET requests (because that’s all that I needed).
As a good first test, your site should be able to load the resource directly from the original Digital Ocean Spaces URL (e.g., https://bucket.region.digialoceanspaces.com or https://bucket.region.cdn.digitaloceanspaces.com). If you get the same “No Access-Control-Allow-Origin header is present” error when trying to load from there, then you’ve configured something wrong. Once you’re able to have domain.com load resources from the original URL (*.digitaloceanspaces.com), then you’ll know things are configured correctly on Digital Ocean and you can start loading resources from sub.domain.com via Cloudflare. (You may have to update Cloudflare’s cache. See the documentation link that I posted earlier.)
You can test all of this out with localhost first if you want, but in that case you’ll have to temporarily add localhost to the Digital Ocean Spaces CORS Configuration as well.
One more thing: After I did all of this, I could get the image to load from the Digital Ocean URL, but not from Cloudflare. This was because on Cloudflare I had turned I'm Under Attack! mode on. (Because my app isn’t released yet, I almost always have this on during development unless I’m testing some stuff in production.) If Cloudflare deems the resource request to be suspicious, it will reject the resource request with 403 Forbidden. If that happens, the request won’t even reach your S3 bucket, so no image will load. I’m assuming that most people don’t have I'm Under Attack! mode on all the time. But in case you keep running into issues after correcting your S3 bucket settings, make sure that Cloudflare isn’t rejecting your request with 403s or with some other response that has the Cf-Mitigated header. If your resource requests are being rejected by Cloudflare, you’ll obviously have more digging to do.