unable to display external host image - image

I'm unable to display image of external host on JSF page. In my case it is Apache file server. I'm creating image URL in #RequestScoped bean and then trying to pass it as String in #ViewScoped bean to frontend.
I've tried to display image in two ways:
First by loading it with JSF:
<h:graphicImage name="#{myViewScopedBean.myObject.mainImageUrl}" />
And then with html <img> tag as referenced in this answer.
Afterwards I've tried to print all attributes of myObject.
All String attributes are displayed well, except mainImageUrl. and I'm 100% sure that I'm setting mainImageUrl on backend.
What can provoke this problem? Is there any security JSF configuration?

The name attribute of <h:graphicImage> should represent a JSF resource name, not an URL. JSF resources are explained in among others How to reference CSS / JS / image resource in Facelets template? If you intend to specify a real URL, then you should be using value attribtue instead, or just plain HTML <img>.
So, either
<h:graphicImage value="#{myViewScopedBean.myObject.mainImageUrl}" />
Or
<img src="#{myViewScopedBean.myObject.mainImageUrl}" />
If that still doesn't work, then apparently the URL is plain wrong. Verify the generated HTML output and the browser's builtin HTTP traffic monitor (press F12). You should be able to open the image independently by copypasting exactly that URL straight into browser's address bar.

Related

Grails show url content in template (like frame src)

I hava a Grails app and I want to make use of the Spring Security User Admin Screen. The screen can be accessed via the url
localhost:8080/user
Since I am not working with urls, but with templates (url always remains localhost:8080), but users can navigate via navbar und templates are loaded, I want to render the url localhost:8080/user into a template. I tried to render a template that contains
<frame src="localhost:8080/user">
but Grails didn't really like this.
What's the best way to do this?
You can try using an iframe instead of a frame.
I would also use the Grails createLink tag (see http://www.grails.org/doc/2.3.x/ref/Tags/createLink.html) to generate the src attribute value. This would ensure the src has the correct context root, port number, etc...
<iframe src="${createLink(controller: 'user', absolute: true)}" />

web.xml error-page does not display image

I have an error.html page which I want to redirect to when a user comes accross Error404 for example. The below is working:
<error-page>
<error-code>404</error-code>
<location>/error404.jsp</location>
</error-page>
However, my error404.jsp file contains an image which doesn't get displayed when user is redirected. If I just type in the URL, the full page with image is displayed. But if a user tries to do something which reports error 404, the error404.jsp file gets displayed without the image.
I also tried with having an error404.html but I get the same problem...
Do you have any ideas why this is happening?
Many thanks
Ena
When the error page is rendered, its content is returned in the HTTP response without a redirect. This means that the browser still 'sees' it in context of the URL of the request that had an error. So any relative resource links (images, css, etc.) will be relative to the current page's URL.
So if you have the following setup:
image1.gif in images folder
error404.jsp that references the image as "../images/image1.gif"
You will find that typing http://yourserver.com/YourContextRoot/error404.jsp works fine, but when you use http://yourserver.com/YourContextRoot/path1/path2/missingPage it tries to look for the image in the wrong path (i.e. under /YourContextRoot/path1/images/image1.gif).
The solution is to use JSP EL or scriptlet to create a server-relative link (i.e. starts with a '/'), by including context-root:
<img src="${pageContext.request.contextPath}/images/image1.gif" />
I hope that works!

How to show the server path image to PrimeFaces p:graphicImage?

When I retreive server path and show into the p:graphicImage tag, then images are not displayed. Images are loaded into outside the webbapp folder. Server path of the images are like this \\qbsserver\Test Folder\test\car.jpg.
<p:graphicImage value="\\qbsserver\Test Folder\test\\#{image.imageName}" />
How can I make them to display? I am using PrimeFaces 3.0 and JSF 2.0 in Eclipse IDE.
You're making a conceptual mistake. It's not the server who includes and sends the image along with the generated HTML output somehow. It's the webbrowser who downloads the image by its URL as specified in the <img src> when it encounters an <img> tag in the HTML.
So it has really to be a normal URL, exactly the one as the enduser would enter in the webbrowser's address bar, not a server specific local disk file system path. The enduser using the webbrowser really doesn't have that image on exactly that path on its local disk file system.
Easiest would be to add the folder as a "virtual context" of the servletcontainer which you're using. It's unclear which one you're using. In Tomcat it's a matter of adding a new <Context> to the server.xml
<Context docBase="/path/to/images" path="/images" />
and in Glassfish it's a matter of adding an alternatedocroot to the glassfish-web.xml
<property name="alternatedocroot_1" value="from=/images/* dir=/path/to" />
Refer the documentation of the servletcontainer for details. Ultimately they should be accessible by a normal URL so that you can just use for example:
<p:graphicImage value="/images/#{image.imageName}" />
Other ways involve using PrimeFaces StreamedContent API or homegrowing a servlet.
See also:
Simplest way to serve static data from outside the application server in a Java web application

ajaxified file upload in jsf

I want to do a file upload without posting an entire form. The file upload works fine, but the whole form is submitted. This works fine when validation is correct. But when p.e. a required field is empty, the upload does not work and a error message is returned (required field missing)
So i tried to ajax the file upload (ajax=true). But then the upload does nothing.
I tried a work around bu putting the file upload and other fields in different forms. This works, but the result is that data you changed in the other fields is disregarded when doing the file upload.
Any suggestions?
Here is my code I use:
<t:inputFileUpload id="fileupload" value="#{prospectDetail.upFile}" size="50" />
<h:outputLabel for="description" value="#{msg.prospectdetail_description}"/>
<mw:inputText id="description" size="40" value="#{prospectDetail.fileDescription}" />
<p:commandButton styleClass="button" value="#{msg.common_upload}" action="#{prospectDetail.upload}" ajax="false" process="#form" onbegin="busyPopup.show()" oncomplete="busyPopup.hide();"/>
It is not possible to upload files by first version of XMLHttpRequest (which is the core Ajax request controller object in JavaScript). The second version of XMLHttpRequest supports it, but this is not implemented by <p:commandButton> (and has currently low browser support).
As you seem to be using PrimeFaces already, why don't you just use its own <p:fileUpload> component? The single upload or even the auto upload examples should do it for you (don't forget to remove the MyFaces extensions filter from the web.xml after adding the PrimeFaces' file upload filter!). The PrimeFaces' <p:fileUpload> will automatically utilize XHR2 file upload whenever available.
I tried a work around bu putting the file upload and other fields in different forms. This works, but the result is that data you changed in the other fields is disregarded when doing the file upload.
If you put the bean in the view scope instead of the request scope and return null or void from action methods, then this should work.

UrlFilenameViewController keeping URL extension in the view name

I am using Spring MVC, and am using the UrlFilenameViewController to directly map incoming URLs onto my View Resolver without a controller in between. I'm using this to have Freemarker written CSS and JS files, by simply having a .css.ftl and .js.ftl file in the appropriate place. This much all works great.
Some browsers seem to have problems with .css files being returned without a Content-type of text/css, and the Freemarker view resolver doesn't allow for setting the content type of the response based on the view requested. To get around this I've written my own ViewResolver that looks at the View name and sets the Content Type based on that - so any view name that ends in .css will have a Content Type of text/css. This bit also works great.
The problem is that in order to get my view name to be style.css I need to actually request style.css.css, because the UrlFilenameViewController strips the extension off to get the view name it is using. How do I stop this happening so that "/style.css" actually resolves to a view of "style.css" and thus to the "style.css.ftl" template?
I suggest subclassing UrlFilenameViewController and overriding the extractViewNameFromUrlPath() method to just return the path as the view name.
You could also file an issue on the SpringSource JIRA asking them to make this configurable.

Resources