🛠️ Issue: Fix Cloudflare R2 CORS policy

Error:

No 'Access-Control-Allow-Origin' header is present on the requested resource.

If you’re facing this error while using a custom domain with Cloudflare R2, you can fix it by adding a Transform Rule to your domain inside Cloudflare.

✅ Solution: Add a `Vary` header using Transform Rules

Cloudflare by default does not return proper Vary headers, which are needed for CORS to work correctly, especially when Origin, Access-Control-Request-Method, or Access-Control-Request-Headers vary between requests.

🚀 Step-by-Step Tutorial

1. Go to your Cloudflare Dashboard

Visit: https://dash.cloudflare.com
Select the domain you’re using as a custom R2 endpoint (e.g. cloud.sngine.com)

2. Navigate to:

Rules

3. Click: “Create rule” under

→ Response Header Transform Rule

4. Fill in the Rule

Rule name: Fix R2 CORS Headers (or whatever you want)
If incoming requests match:
- Choose “Custom filter expression”
- Set the filter to match your R2 custom domain by Host:
  - Field: Host
  - Operator: equals
  - Value: your custom domain (e.g., cloud.sngine.com)
  - You’ll see: (http.host eq "cdn.example.com")

5. Under “Then…”, modify response header:

Click “Select new…” → Set new header
Fill in:
- Header name: Vary
- Value: Origin, Access-Control-Request-Method, Access-Control-Request-Headers

6. Click Deploy

That’s it.

Happy Sngine 🙂

Buy Sngine or Extend your support: https://bit.ly/BuySngine

✅ Solution: Add a Vary header using Transform Rules