12

Spring Security と JSP ページを使用して、レガシー Java Web アプリ用のカスタム ログイン ページを作成しました。レガシー アプリは Spring MVC を使用しません。MyEclipse でプレビューすると、CSS スタイルが適用されます。しかし、デバッグモードで実行してFirefoxで見ると、問題があります。1) CSS はレンダリングされません。2) フォームを送信すると、CSS ファイルにリダイレクトされるため、ブラウザには CSS ファイルのテキストが表示されます。

私はこれを数日間調べましたが、このサイトや他のサイトで解決策が見つかりませんでした. これまで JSP や Spring Security を使用する必要がなかったので、原因さえわかりません。誰かが私が台無しにしている場所を指摘できますか?

私のlogin.jspファイル:

<?xml version="1.0" encoding="ISO-8859-1" ?>
<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1" session="true"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<c:url value="/user_pass_login" var="loginUrl"/>
<html>

<HEAD>
    <link href="Tracker.css" type="text/css" rel="stylesheet">
    <TITLE>ATP3 Login</TITLE>
</HEAD>

<body onload='document.loginForm.username.focus();'>
    <DIV id="login_body"
            align="center" >
        <h1>Sample Tracker Login</h1>

        <form id="loginForm" name="loginForm" action="${loginUrl}" method="post">
            <c:if test="${param.error != null}">
                <div class="alert alert-error">
                    Failed to login.
                    <c:if test="${SPRING_SECURITY_LAST_EXCEPTION != null}">
                                <BR /><BR />Reason: <c:out value="${SPRING_SECURITY_LAST_EXCEPTION.message}" />
                    </c:if>
                </div>
            </c:if>
            <c:if test="${param.logout != null}">
                <div class="alert alert-success">You have been logged out.</div>
            </c:if>
            <BR />
            <label for="username">Username:</label> 
            <input 
                type="text" 
                id="username"
                name="username" />
            <BR />
            <BR />
            <label for="password">Password:  </label> 
            <input
                type="password"
                id="password" 
                name="password" />
            <BR />
            <BR />
            <div class="form-actions">
                <input 
                    id="submit" 
                    class="btn" 
                    name="submit" 
                    type="submit"
                    value="Login" />
            </div>
        </form>
    </DIV>
    </body>
</html>

ログインすると、CSS ファイルTracker.cssの URL にリダイレクトされます。

/** Add css rules here for your application. */


/** Example rules used by the template application (remove for your app) */
h1 {
  font-size: 2em;
  font-weight: bold;
  color: #000555;
  margin: 40px 0px 70px;
  text-align: center;
}

#login_body, #formLogin {
    color: #000555;
    background-color: #F6FCED;  
}

.sendButton {
  display: block;
  font-size: 16pt;
}

/** Most GWT widgets already have a style name defined */
.gwt-DialogBox {
  width: 400px;
}

...

@Santosh Joshi の発言について考えた後、Spring Security 構成 XML ファイル内のセキュリティ設定を確認しました。そして、ここに何が起こっていたかです:

  1. login.jspが最初にロードされるとき、 Tracker.cssファイルへのアクセス権がありません。これは、セキュリティ設定によりアクセスできないため (修正されたファイルについては以下を参照)、ページがフォーマットされていないためです。
  2. ユーザーが正常にログインすると、CSS ファイルが見つかりますが、JSP の形式が正しくないため、CSS ファイルが吐き出されるだけです。

修正

  1. login.jspを次 のように変更しました。
    1. xml定義で1行目を削除
    2. url 変数宣言のある行 4 を form タグのすぐ上に移動します。
    3. JSP ディレクティブのすぐ下に html ドキュメント タイプの定義を追加します。
  2. Spring Security XML の http タグに許可行を追加しました

新しいlogin.jspファイル

<!DOCTYPE html>
<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1" session="true"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<html>

    <HEAD>
        <link href="Tracker.css" type="text/css" rel="stylesheet">
        <TITLE>ATP3 Login</TITLE>
    </HEAD>

    <body onload='document.loginForm.username.focus();'>
        <DIV id="login_body"
                align="center" >
            <h1>Sample Tracker Login</h1>

            <c:url value="/user_pass_login" var="loginUrl"/>
            <form id="loginForm" name="loginForm" action="${loginUrl}" method="post">
                <c:if test="${param.error != null}">
                    <div class="alert alert-error">
                        Failed to login.
                        <c:if test="${SPRING_SECURITY_LAST_EXCEPTION != null}">
                                    <BR /><BR />Reason: <c:out value="${SPRING_SECURITY_LAST_EXCEPTION.message}" />
                        </c:if>
                    </div>
                </c:if>
                <c:if test="${param.logout != null}">
                    <div class="alert alert-success">You have been logged out.</div>
                </c:if>
                <BR />
                <label for="username">Username:</label> 
                <input 
                    type="text" 
                    id="username"
                    name="username" />
                <BR />
                <BR />
                <label for="password">Password:  </label> 
                <input
                    type="password"
                    id="password" 
                    name="password" />
                <BR />
                <BR />
                <div class="form-actions">
                    <input 
                        id="submit" 
                        class="btn" 
                        name="submit" 
                        type="submit"
                        value="Login" />
                </div>
            </form>
        </DIV>
    </body>
</html>

セキュリティ XML ファイルの抜粋を次に示します。Tracker.cssの新しい Intercept-url タグに注意してください。

<!-- This is where we configure Spring-Security  -->
<http auto-config="true" 
        use-expressions="true" 
        disable-url-rewriting="true">
    <intercept-url pattern="/"
        access="permitAll"/>
    <intercept-url pattern="/login*"
        access="permitAll"/>
    <intercept-url pattern="/login*/*"
        access="permitAll"/>
    <intercept-url pattern="/favicon.ico"
        access="permitAll"/>
    <intercept-url pattern="/Tracker.css"
        access="permitAll"/>
    <intercept-url pattern="/**"
        access="hasAnyRole('ROLE_ADMIN','ROLE_WRITE','ROLE_READ')"/>
    <form-login login-page="/login.jsp"
        login-processing-url="/user_pass_login"
        username-parameter="username"
        password-parameter="password" />
</http>
4

3 に答える 3

2

CSS をどこに配置したか、CSS のパスに問題があるようです

<link href="Tracker.css" type="text/css" rel="stylesheet"/>

Firebug を使用して Firefox でアプリケーションをデバッグすることもできます。適用されない場合は、CSS が正しくダウンロードされていないことを意味し、Firefox のコンソールで 404 またはその他のエラーを確認してください。また、Firefox が実際にこれを取得したい (Firefox が参照している URL) CSS の頬。

于 2013-11-10T21:01:19.580 に答える