Flowcard visual resources not loading from publisher servers

Q: Why are visual resources not loading inside Flowcards?

Flowcards are served from the mrf.io domain. When they reference visual resources hosted on a publisher's server, the browser blocks those cross-origin requests unless the publisher's server includes the correct Access-Control-Allow-Origin header.

Q: How do I fix fonts or typography not loading in Flowcards?

Enable the Access-Control-Allow-Origin header on your HTTP server. This allows the mrf.io domain to load publisher-hosted resources like fonts, images, and stylesheets inside Flowcards.

Flowcards are served from the mrf.io domain and may reference visual resources hosted on publisher servers. When the publisher’s server does not include the correct cross-origin headers, those resources fail to load.

In the screenshot below, the headline typography is loaded from the publisher’s domain but does not render correctly:

Headline typography failing to load inside a Flowcard due to missing cross-origin headers|461x500

Solution

Enable the Access-Control-Allow-Origin header on your HTTP server. This allows the mrf.io domain to fetch publisher-hosted resources (fonts, images, stylesheets) and display them correctly inside Flowcards.

For additional cross-origin troubleshooting scenarios, see Experiences testing and troubleshooting.

Why are visual resources not loading inside Flowcards?

Flowcards are served from the mrf.io domain. When they reference visual resources hosted on a publisher’s server, the browser blocks those cross-origin requests unless the publisher’s server includes the correct Access-Control-Allow-Origin header.

How do I fix fonts or typography not loading in Flowcards?

Enable the Access-Control-Allow-Origin header on your HTTP server. This allows the mrf.io domain to load publisher-hosted resources like fonts, images, and stylesheets inside Flowcards.