How do i refer to any image in my java web application from root of my web application?

Question

I have a folder named Common/Images/Photounavailable.jpg . Is this right way of refering to a image from root? I want to refer this image from any page in any folder in my web application.

private String getPhotoUnavailablePath = "/Common/Images/PhotoNotAvailable.jpg";
    private String getPhotoUnavailablePath(){
        return photoUnavailablePath;
    }

And from my JSF page i write something like :-

<h:outputLink id ="blogPhoto" value="#{BlogBean.photoUnavailablePath}" >
  <h:graphicImage value="#{BlogBean.photoUnavailablePath}" style="width: 180px;height: 180px;"/>
</h:outputLink>

I get the image to see in h:graphicImage. But when i click on it, i get 404 error. OutputLink doesn't get proper link to image. How is it possible? That h:graphicImage gets proper link and h:outputLink doesn't?

Further, this code works perfectly :-

<h:outputLink id ="blogPhoto" value="..#{BlogBean.photoUnavailablePath}" >
  <h:graphicImage value="#{BlogBean.photoUnavailablePath}" style="width: 180px;height: 180px;"/>
</h:outputLink>

Just by putting .. it works! Can anybody explain me what is happening and how do I solve this?

Answer 1

<h:graphicImage> uses context-relative paths.
<h:outputLink> uses absolute paths. That's why you can't use the / (unless in the root context).

You can use something like

 value="#{facesContext.externalContext.context.contextPath}/#{bean.path}"

to specify that the start of the path is the context root, not the server root.