May I ask if you’re using an iFrame code to show Google Maps on your Website in that box? Might be missing some attributes due to the crossorigin.
Furthermore, are you using Content-Security-Policy Header as well?
If it’s a Custom Error Page for Cloudflare, I might be afraid you cannot modify HTTP headers nor CSP if that’s the case, and Custom Error Pages might be restricted from implementing some things, therefrom embeding iFrame is getting blocked.
Otherwise, I am not sure for further troubleshooting.
I’d suggest you to double-check the Developer Tools (F12) → Network and Console tab, once this error occurs to track down what requests are getting blocked.
EDIT: I’ve tested few moments ago and iFrames do work, no CSP policy and you can have the Maps on Custom Error Page:
Thanks @Fritex, the error is related to not using an API key. When I showed only this iframe, the response was “The Google Maps Embed API must be used in an iframe.”
No need for API key, my best guess, except you’re showing some custom icons and more styling?
Generate one at Google Cloud Platform if needed and not already, then use but restrict to your domain and Cloudflare only (not sure if this is billable by Google or free one):
How to embed the Map:
I am afraid this is not an Cloudflare issue at all.
Still getting "www.google.com refused to connect.’ It has something to do with - htaccess Access-Control-Allow-Origin (I think). I tried with the website you shared Fritex to embed code and reentering the map code straight from Google as well. It show up if I access the webpage directly and if I preview it on Cloudflare, but just not when I try it live.
So, to sum it up, the map works if I directly access it, it works if I preview it in Cloudflare, but if I
change my IP to a so it produces a country challenge (as I have it set up for), the map refuses to connect to Google, so yes, it’s a CF issue.
If you go to [URL] and use a VPN for Ireland, you can see the issue. Chome displays “Google refused to connect.” and with Firefox, it’s just a blank space below " We provide low-cost and high-quality web design services. We are certainly sorry for the issue and hope that you will reach out and contact us if there is a problem.
Also, feel free to message us on Google here."
I have removed the x-frame through CF and the server, but when I check the headers, x-frame is still there. Is there another way I can clear the cache with custom error pages?