Embedded SVG not visible

Michael Fischer

I'm trying to add an SVG-Image like this:

esource res = new ThemeResource("img/admin.svg");
Embedded object = new Embedded("My SVG", res);
object.setMimeType("image/svg+xml");
contentLayout.addComponent(object);

In the final DOM it shows up as <object> Tag with correct URI (see Attachment) but is not rendered by the browser.
If I use the same Resource with com.vaadin.ui.Image everything works fine.

What am I missing?
Any help is highly appreciated. Thanks!

EDIT: Vaadin 7.4.5, Vaadin Spring 1.0.0.beta3, Java 1.8

svg_dom.PNG (19.3 kB)

Emmanuelle Victoria

Please try removing the setMimeType. Have you tested a different browser?

Michael Fischer

Withouth setMimeType the behaviour is exactly the same.
The problem exists in Chrome, Firefox and Internet Explorer.

In Internet Explorer, the following message appears instead of the SVG-Image:

When clicking "Open this content in a new window" the SVG is displayed correctly in a new Tab.

Michael Fischer

The problem was to be found somewhere else: Spring Security.

From the Spring Security documentation:
The X-Frame-Options response header instructs the browser to prevent any site with this header in the response from being rendered within a frame. By default, Spring Security disables rendering within an iframe.

I solved the issue by adding the following arguments to my SecurityConfiguration:

...
.and().headers().addHeaderWriter(new XFrameOptionsHeaderWriter(XFrameOptionsMode.SAMEORIGIN));

Karsten Ludwig Hauser

http.headers().frameOptions().disable();

also helps

Important Notice - Forums is archived

Vaadin lets you build secure, UX-first PWAs entirely in Java.
Free ebook & tutorial.

Important Notice - Forums is archived

Vaadin lets you build secure, UX-first PWAs entirely in Java.Free ebook & tutorial.

Embedded SVG not visible

Vaadin lets you build secure, UX-first PWAs entirely in Java.
Free ebook & tutorial.