背景图片不能在HTML中工作

时间:2016-07-01 05:57:53

标签: java html jsp filter

我在forgotpassword.jsp页面上提供了index.html的链接,但过了一段时间后我决定更改它,所以我创建了一个新的html文件forgotpassword.html,这两个文件的正文相似但是图片显示在forgotpassword.jsp中,但不显示在forgotpassword.html中。 forgotpassword.jsp进一步传递给pass.jsp,我也为它做了同样的事情并为它创建pass.html,同样的事情发生在它pass.jsp显示图像但是pass.html不是。有人能告诉我为什么会这样吗? 如果有任何遗漏或错误,请检查过滤器。

的index.html

<!DOCTYPE html>
<html>
<head>
    <title>Login Page</title>
    <meta charset="UTF-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <style>
        header {
            background-color:lightsteelblue;
            color:white;
            text-align:center;
            padding:5px;
        }
        nav {
            line-height:30px;
            height:300px;
            width:100px;
            float:left;
            padding:5px;
        }
        section {
            width:600px;
            float:right;
            padding:220px;
        }
        footer {
            background-color:black;
            color:white;
            clear:both;
            float:bottom; 
            text-align:center;
            padding:5px;                                
        }
    </style>
</head>
<body style="background-color: lightsteelblue">        
    <header>
        <canvas  id="myCanvas" width="500" height="100" style="border:2px solid black; background-color:burlywood ">
            Your browser does not support the HTML5 canvas tag.</canvas>

        <script>
            var c = document.getElementById("myCanvas");
            var ctx = c.getContext("2d");
            ctx.font = "45px Arial";
            ctx.strokeText("File Tracking System", 50, 50);

        </script>  
    </header>
    <a href="forgotpass.jsp">Forgot Your Password</a>
    <section>
        <form action="LoginServlet" method="post">            
            Username: <input type="text" name="user"/>
            <br />
            Password: <input type="password" name="pwd"/>
            <br />
            <input type="submit" value="Login"/>

        </form>
        <img src="css/NSIC-logo1.png" width="537" height="267" alt="NSIC-logo1"/>
    </section>
    <footer>Copyright 2016 NSIC. All right reserved.</footer>        
</body>
</html>

forgotpass.jsp

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Forgot Password Page</title>
    <style>
        header {
            background-color:teal;
            color:white;
            text-align:center;
            padding:5px;
        }
        nav {
            line-height:30px;
            height:300px;
            width:120px;
            float:left;
            padding:5px;
        }
        section {
            width:800px;
            float:right;
            padding:130px;
        }
        footer {
            background-color:black;
            float:bottom;
            color:white;
            clear:both;
            text-align:center;
            padding:5px;
        }
    </style>
</head>
<body style="background-color:lightsteelblue;">
    <header><h3>File Tracking System!!</h3>
        <br>
    </header>
    <nav>
        <form action="forgotServlet" method="POST" >
            User Name:<input type="text" name="name" value="" size="20" />
            Email:<input type="text" name="email" value="" size="20" />
            New Password:<input type="text" name="pass1" value="" size="20" />
            Repeat Password:<input type="text" name="pass2" value="" size="20" />
            <input type="submit" value="submit" name="submit" />
        </form>
    </nav>
    <section><img src="css/NSIC-logo1.png" width="537" height="267" alt="NSIC-logo1"/></section>    
    <footer>
        Copyright 2016 NSIC. All right reserved.                             
    </footer>
</body></html>

forgotpass.html

<!DOCTYPE html>
<html>
<head>
    <title>Forgot Password Page</title>
    <meta charset="UTF-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<style>
        header {
            background-color:teal;
            color:white;
            text-align:center;
            padding:5px;
        }
        nav {
            line-height:30px;
            height:300px;
            width:120px;
            float:left;
            padding:5px;
        }
        section {
            width:800px;
            float:right;
            padding:130px;
        }
        footer {
            background-color:black;
            float:bottom;
            color:white;
            clear:both;
            text-align:center;
            padding:5px;
        }
    </style>
</head>
<body style="background-color:lightsteelblue;">
    <header><h3>File Tracking System!!</h3>
        <br>
    </header>
    <nav>
        <form action="forgotServlet" method="POST" >
            User Name:<input type="text" name="name" value="" size="20" />
            Email:<input type="text" name="email" value="" size="20" />
            New Password:<input type="text" name="pass1" value="" size="20" />
            Repeat Password:<input type="text" name="pass2" value="" size="20" />
            <input type="submit" value="submit" name="submit" />
        </form>
    </nav>
    <section><img src="css/NSIC-logo1.png" width="537" height="267" alt="NSIC-logo1"/></section>    
    <footer>
        Copyright 2016 NSIC. All right reserved.                             
    </footer>
</body></html>

这是我的AuthenticationFilter -

package bean;

import java.io.IOException;
import javax.servlet.Filter;
import javax.servlet.FilterChain;
import javax.servlet.FilterConfig;
import javax.servlet.ServletContext;
import javax.servlet.ServletException;
import javax.servlet.ServletRequest;
import javax.servlet.ServletResponse;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;

public class AuthenticationFilter implements Filter {

private ServletContext context;

@Override
public void init(FilterConfig fConfig) throws ServletException {
    this.context = fConfig.getServletContext();
    this.context.log("AuthenticationFilter initialized");
}

@Override
public void doFilter(ServletRequest request, ServletResponse response, FilterChain chain) throws IOException, ServletException {

    HttpServletRequest req = (HttpServletRequest) request;
    HttpServletResponse res = (HttpServletResponse) response;

    res.setHeader("Cache-Control", "no-cache, no-store, must-revalidate"); // HTTP 1.1.
    res.setHeader("Pragma", "no-cache"); // HTTP 1.0.
    res.setDateHeader("Expires", 0); // Proxies.

    String uri = req.getRequestURI();
    this.context.log("Requested Resource::" + uri);

    HttpSession session = req.getSession(false);

    if (session == null && !(uri.endsWith("html") || uri.endsWith("LoginServlet") || uri.endsWith("forgotpass.jsp") || uri.endsWith("doesnotexist.jsp") || uri.endsWith("pass.jsp"))) {
        this.context.log("Unauthorized access request");
        res.sendRedirect("index.html");
    } else {
        // pass the request along the filter chain
        chain.doFilter(request, response);
    }

}

@Override
public void destroy() {
    //close any resources here
}

}

1 个答案:

答案 0 :(得分:2)

编辑:chat-conversation-with-rahul问题是真的。我无法解决它。

HTML和JSP文件的文件结构存在问题。正如@aksappy所评论的那样,请检查开发人员工具(CTRL+SHIFT+I是否为chrome)以查找console错误。另外,请检查开发人员工具中src<img>文件中html标记的jsp属性。

您的代码运行正常。

<强>证明

JSP IMAGE JSP IMAGE

HTML图片 HTML IMAGE