Guides›Images from other domains

Images from other domains

If a picture comes from another domain, such as a CDN, glass may refuse to read it and fall back to CSS. Nothing is broken: this is how browsers protect people.

Why it happens

Without this rule, any site could load a private image from another site and read it. So to read pixels from another domain, that domain has to agree. Agreement is a header called CORS.

How to tell

Glass turns into plain blur, and the console shows a warning that it can't read the backdrop.

Fix it on the server

Ask the server with the image to send this header. Most CDNs and storage services have a setting for it.

Access-Control-Allow-Origin: *

Then ask for it in the tag

An image in your page needs crossorigin too, or the browser loads it the old way.

<img src="https://cdn.example.com/photo.jpg" crossorigin="anonymous" alt="">

Or avoid the problem

Serve the image from your own domain. Same domain, no CORS.