SVG textures with embedded HTML cross-origin issue


Context: I am developing a “3D PowerPoint” - using BabylonJS to create awesome “3D-ish” presentations - Bjorn's 3D-decks

Problem: I am using a lot of SVG textures but I ran into a showstopper, can’t use embedded HTML in the SVG via a foreignObject element. Getting error “Failed to execute ‘texImage2D’ on ‘WebGL2RenderingContext’: The image element contains cross-origin data, and may not be loaded”

Any chance this could be fixed?

All the best,

Welcome aboard!

I think a repro in the Playground would help to understand what’s going on.

If you have some urls pointing to outside data, make sure the server allows CORS on these data. You can also try to wrap those urls in if you can’t setup the server properly.

I did find a work around, using a “data:” url for the SVG.
Did find another issue with SVG and images using object URLs. Will open another ticker for that one.