Embedding Vaadin in a Web Page - Embedded resource problem

Hi all,

I am new in Vaadin and I bumped into a problem. I embedded the Vaadin application inside a web page as proposed in the Vaadin book and it worked well. I also used the embedded resource to display image. I followed the instruction of adding a timestamp in the filename to avoid the refresh problem. The solution works well if the application is stand alone. But if you embed it in the web page, it loses the image once you hit the refresh button of the browser.

For all of you who may ask, I am using the eXo WCM (similar to Liferay) but instead of using it as a portlet, I just embed in the web page.

When I look on Firebug, the filename of the resource doesn’t seem to change. Is there any workaround?

Any help will be much appreciated.


Does anybody knows a work around?

It might be something to do with the integration, but cannot say for sure…

Using timestamp in file name is a straight-forward way to change the url and force browsers to reload the image data - otherwise changes may not reflect to browser. This is what you are looking for, right?

Have you tested copy pasting the generated image URL into browser separately to see it works to display the image?

Thanks Sami.

I looked on the URL and the time stamp is still the same. I have a good feeling that eXo/Portal is also doing
some caching. I just have to test it. But it seems that I cannot do anything on the side of Vaadin.


I’m not completely sure which timestamping code you are refering to, but in general page refreshes should not change the filename / URL in Vaadin - standalone or not.

The timestamping pattern only helps to overcome the fact that filenames cannot be the same for different image data or browsers will sometime cache them and display the old resource data instead. This might become as surprise in your code because even if you change the
source in Embdded
(or even the whole Embedded instance) you have to change the filename too to actually display the new image data. Your case seems a bit different.

Do you see the portal changing the resource (image) URLs some way compared to the standalone version? That might mess with Vaadin’s resource handling.

Sorry for being lazy on explaining. What I mean is adding the the timestamp to the filename so that URL of the image will always be different.

I just found the problem though. I am using the FragmentChangedListener event. And when I click the reload
button, the URI doesn’t change, thus my function to reload the embedded image are not being called.

To answer your question, the problem exists both on standalone and embedded version.

Just found a discussion, relating to my problem

adding the ?restartApplication as Kim suggested
like [http://demo.vaadin.com/Calc/?restartApplication]

will do the trick.

Unfortunately, it looks ugly seeing the URL with ?restartApplication.

Is there another trick for this? Could it be embedded on the Javascript?