4 Replies Latest reply on Jan 21, 2008 5:20 PM by Yuri Bosakaba

    Form Based Authentication with Stylesheet

    Yuri Bosakaba Newbie

      Hello everybody,

      I've been working on securing a simple web-application of mine.
      I used a container managed security, Form Based Authentication with database connection.
      It works fine!

      My problem is I got a login.jsp page that JBoss present when you try to access the web-app
      and this login.jsp is just black and white. I made a CSS file to tune it up a little, but for some
      reason (which I don't know, yet) it doesn't load the CSS file.
      Here is my login.jsp:

      <html>
      <head>
       <title>My WebApp</title>
       <link rel="StyleSheet" href="/styles.css" type="text/css"/>
      
      </head>
       <body>
       <p class="header">
       <h1>Please log in X</h1>
       </p>
      
       <form method="POST" action="j_security_check">
       User Name: <input type="text" name="j_username" /><br/>
       Password: <input type="password" name="j_password" /><br/>
       <input type="submit" value="Login" />
       </form>
       <TABLE>
       <TR><TH CLASS="TITLE">Loggie</TH></TR>
       </TABLE>
       <p style="color:blue">
       This is the last line!
       </p>
       <p class="header">
       This is the last line!!!
       </p>
       </body>
      </html>
      


      The This is the last line! text should be blue when loaded and is not
      when the page is loaded.
      On the other hande the This is the last line!!! text does show blue when loaded.
      Now I can go ahead and just put the style in every tag, but that's I don't want that. I have a large CSS file which I want to try out.

      This is my CSS file:
      BODY { background-color: #FDF5E6 }
      
      TH.TITLE { background-color: #FFAD00;
       font-size: 50px;
       font-family: Arial Black, Arial, Helvetica, sans-serif;
      }
      


      Another thing is the body doesn't load the color I gave up for it to be.

      Can someone please help me, give me advice how to load the CSS file (if it is possible).
      Thanks in advanced

      -Yuri

        • 1. Re: Form Based Authentication with Stylesheet
          Yuri Bosakaba Newbie

          Hellooo....

          No one can give some avise, please?

          • 2. Re: Form Based Authentication with Stylesheet
            Ragav Gomatam Novice

            style class="header". Where is it declared in your style sheet ? Looks like your style sheet styles.css is not being picked up. Try opening the browser & type in

            http://<your-host>:<port>/web-context/your-style-sheet.


            It seems that your style sheet is under root location. So if this url displays your style sheet, then it should work. Else you have a issue with location of your style sheet

            • 3. Re: Form Based Authentication with Stylesheet
              Yuri Bosakaba Newbie

              Hello ragavgomatam,

              First of all thanks for your reply.
              I've tried putting "style class="header" instead of "class"header".
              Unfortunately, no success.
              When I point my browser to http://localhost:8080/numberG/pages/style.css it does present the stylesheet!

              It looks indeed like my CSS is getting hold up somewhere, but I don't know the where or what is the issue.

              This is my page:

              <html xmlns="http://www.w3.org/1999/xhtml">
              <head>
               <title>ServiceCom MVS</title>
               <link rel="StyleSheet" href="/pages/styles.css" type="text/css"/>
              
              </head>
               <body style="background-image url(/bg-header.jpg)">
              
               <p style class="header">
               <h1>Please log in X</h1>
               </p>
              
               <form method="POST" action="j_security_check">
               User Name: <input type="text" name="j_username" /><br />
               Password: <input type="password" name="j_password" /><br />
               <input type="submit" value="Login" />
               </form>
               <TABLE>
               <TR><TH CLASS="TITLE">Loggie</TH></TR>
               </TABLE>
              
               <p style="color:blue">
               This is the last line!
               </p>
               <p style class="header">
               This is the last line!
               </p>
               </body>
              </html>
              



              And this my CSS:
              BODY { background-color: #FDF5E6 }
              
              TH.TITLE { background-color: #FFAD00;
               font-size: 50px;
               font-family: Arial Black, Arial, Helvetica, sans-serif;
              }
              
              .header
              {
               color:blue;
              }
              
              .messages
              {
               color:red;
               font-family:tahoma;
               font-size:10px;
              }
              
              .inputs
              {
               font-size:60%;
               height:18;
              }
              



              Both file are located in a 'pages' directory where also the WEB-INF directory is located.
              You think that would be a problem?

              -Yuri

              • 4. Re: Form Based Authentication with Stylesheet
                Yuri Bosakaba Newbie

                Hey everybody,

                I know what the issue was.
                In my web.xml I declared a security-constraint in which I gave up that
                all my web contents are secured!
                And my CSS and images are secured.
                So by the time the loginpage request the CSS it will never get it because you're not authenticated yet.