为什么我的Spring Security login.jsp会戳CSS，我该如何解决？

小编典典

为什么我的Spring Security login.jsp会戳CSS，我该如何解决？

jsp

我已经使用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的网址 ：

/** 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文件中的安全设置。这是正在发生的事情：

当 login.jsp的 第一次加载它没有访问 Tracker.css 文件，因为安全设置防止它（参见下面的修正文件），所以页面未格式化。
当用户成功登录时，可以找到CSS文件，但是由于JSP格式错误，因此它只会喷出CSS文件。

修复

我修改了 login.jsp 如下：
1. 用xml定义删除第1行
2. 将带有url变量声明的第4行移到form标签上方
3. 在JSP指令下方添加html文档类型定义
我在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 的新拦截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>

阅读 390

2020-06-10

共1个答案

小编典典

CSS路径似乎有问题，您将CSS放置在哪里

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

您还可以使用Firebug在Firefox中调试应用程序，如果未应用程序，则表示CSS没有正确下载，只需检查Firefox中的控制台是否存在404或其他错误。还脸颊Firefox实际要在哪里获取此（Firefox所指的URL）CSS。

2020-06-10