Geek Answers Handbook

PrimeFaces CSS skin does not appear on login page, as well as JavaScript undefined errors

I use PrimeFaces 3.4 in my web application, and for a particular page, the controls are not displayed using the regular PrimeFaces screen:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:p="http://primefaces.org/ui"> <h:head> <title>VMS login</title> </h:head> <h:body>   <h:form id="loginForm">     <p:messages id="messages" showDetail="true" autoUpdate="true" closable="true" />     <p:panel header="#{msgs['login.title']}">       <p:panelGrid id="loginPanel" columns="2">         <h:outputText value="#{msgs['login.username']}" />         <p:inputText id="j_username" value="#{loginFormBean.userName}" required="true"></p:inputText>         <p:message for="j_username" ></p:message>         <h:outputText value="#{msgs['login.password']}" />         <p:password id="j_password" value="#{loginFormBean.password}" required="true" feedback="false"></p:password>         <p:message for="j_password"></p:message>         <p:commandButton action="#{loginController.loginUsingSpringAuthenticationManager}" value="#{msgs['login.button']}" update="loginForm" ajax="true"></p:commandButton>       </p:panelGrid>     </p:panel>   </h:form> </h:body> </html>

This leads to:

enter image description here

The panel should have a title, etc.

Interestingly, on another page, where I use <p:layout> with different panels in the layouts, they render perfectly with their normal PrimeFaces appearance.

What am I doing wrong? thank you

+3
source share
1 answer

Given that this only happens on the login page, this can happen when the authentication mechanism also triggers requests for JSF resources, such as CSS / JS / image files, and also redirects them to the login page. The web browser then received an HTML representation of the login page instead of specific resources. If you examined HTTP traffic in the webbrowser developer toolkit, you should also have noticed this.

If you are using self-service authentication with a servlet filter, you need to tell the filter so that it does not redirect them to the login page, just keep going. These are the /javax.faces.resource/* URLs (you can get this URL as ResourceHandler#RESOURCE_IDENTIFIER constant).

 if (request.getRequestURI().startsWith(request.getContextPath() + ResourceHandler.RESOURCE_IDENTIFIER)) { chain.doFilter(request, response); return; } // ...

Or, if you are using container-managed authentication, add /javax.faces.resource/* to the allowed URLs that you should skip from the login check:

 <security-constraint> <web-resource-collection> <web-resource-name>Allowed resources</web-resource-name> <url-pattern>/javax.faces.resource/*</url-pattern> </web-resource-collection> <!-- No Auth Contraint! --> </security-constraint>

See also Exclude css and image resources in web.xml Security Limitations .

Or when you use a third-party authentication system such as Spring Security, you need to say it like this (assuming 3.1.0 or later)

 <http security="none" pattern="/javax.faces.resource/**" />

See also Spring Security 3.0.5 .

Or, when you use PicketLink, see a PrimeFaces-based application using PicketLink does not display the style on the login page .

+5
source

More articles:


All Articles