jsfomnifacesgraphicimage

o:graphicImage does not change when actual image is deleted or updated in database

I am trying to display a which is stored in a database. I have a <o:graphicImage value="#{image.getById(1)}" />.

Note: The ID (1) is only for testing.

My property looks like: 

@Lob
private byte[] image;

and my dao/service is this:

@Name
@ApplicationScoped
public class Images {

    @Inject
    private UserDAO userDAO;

    public byte[] getById(int id) {
        return userDAO.getUserByID(id).getImage();
    }

To the concrete problem:

I just implemented this and the image is displayed correctly. I set the image manually to NULL in the database.

My assumption: The image is not found and the image is not displayed (or the typical 'image is not found'-image.).

But: The old image is displayed. Even after a restart of the server and a clean. Nothing changed. I tried to upload an other image to the database - same result.

What is the problem here? Where is my fault? How can I fix this?

Solution

  • The image is being cached by the client. The <o:graphicImage> is very effective in this.

    You basically need to clean the browser cache, or to perform a forced reload in browser, or open an incognito window.

    One way to avoid this is to include the image's "last modified" timestamp in the lastModified attribute, which can be either a java.util.Date, or a java.lang.Long representing the epoch time. Best is to add this property to your entity.

    <o:graphicImage ... lastModified="#{image.lastModified}" />

    It will ultimately end up as v= request parameter in the generated image URL, hereby tricking the browser cache when it changes.

    Another way is to just change image's ID in method argument. It's in that perspective also a bit strange if you still keep providing the old image ID in the HTML response while this ID doesn't exist in the database anymore.

    See also: