PrimeFaces CSS skin not showing in login page, also JavaScript undefined errors

Question

I am using PrimeFaces 3.4 in my web app and for a particular page the controls are not displayed with the normal PrimeFaces skin:

Answer 1

Given that it only occurs on the login page, that can happen when the authentication mechanism also kicks on requests to JSF resources like CSS/JS/image files and redirects them to the login page as well. The webbrowser would then retrieve the HTML representation of the login page instead of the concrete resources. If you have investigated the HTTP traffic in the webbrowser's developer toolset, then you should have noticed that as well.

If you're using homegrown authentication with a servlet filter, then you need to tell the filter to not redirect them to the login page, but just continue them. It are those /javax.faces.resource/* URLs (you can get that URL path as constant by ResourceHandler#RESOURCE_IDENTIFIER).

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

// ...

Or if you're using container managed authentication, then you should add /javax.faces.resource/* to allowed URLs which should be skipped from login checks:

    
        Allowed resources
        /javax.faces.resource/*
    
    

See also Exclude css & image resources in web.xml Security Constraint.

Or when you're using 3rd party authentication framework like Spring Security, then you need to tell it the following way (assuming 3.1.0 or newer)

See also Spring Security 3.0.5.

Or when you're using PicketLink, see PrimeFaces based application with PicketLink does not show style in login page.