Html提交表单数据，刷新间隔出现412

最新推荐文章于 2021-06-07 18:09:55 发布

acjunt

最新推荐文章于 2021-06-07 18:09:55 发布

阅读量1.7k

点赞数 2

分类专栏： Java Web

本文链接：https://blog.csdn.net/xiyou222/article/details/79543775

版权

Java Web 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

Html提交表单数据，刷新间隔出现412

在学习SpringMVC的过程中出现了如下的问题（IE正常，chrome出现这种情况）：

页面index.html源代码：

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>后台管理系统</title>
<link rel="stylesheet" href="/View/css/style.default.css" type="text/css" />
<script type="text/javascript" src="/View/js/plugins/jquery-1.7.min.js"></script>
<script type="text/javascript" src="/View/js/plugins/jquery-ui-1.8.16.custom.min.js"></script>
<script type="text/javascript" src="/View/js/plugins/jquery.cookie.js"></script>
<script type="text/javascript" src="/View/js/plugins/jquery.uniform.min.js"></script>
<script type="text/javascript" src="/View/js/custom/general.js"></script>
<script type="text/javascript" src="/View/js/custom/index.js"></script>

</head>

<body class="loginpage">
    <div class="loginbox">
        <div class="loginboxinner">
            <div class="logo">
                <h1 class="logo">Hdd.<span>Self</span></h1>
                <span class="slogan">后台管理系统</span>
            </div>
            <br clear="all" /><br />
            <div class="nousername">
                <div id="loginmsg" class="loginmsg">账号不正确.</div>
            </div>
            <form id="login" action="login.action" method="post">
                <div class="username">
                    <div class="usernameinner">
                        <input type="text" name="userName" id="userName" placeholder="userName"/>
                    </div>
                </div>
                <div class="password">
                    <div class="passwordinner">
                        <input type="password" name="password" id="password" placeholder="password" />
                    </div>
                </div>
                <button id="loginSubmit">登录</button>
                <div class="keep"><input type="checkbox" /> 记住密码</div>
            </form>
        </div>
    </div>
</body>
</html>

index.js代码：

(function ($) {
 
	$(document).ready(function () {

		$('#loginSubmit').click(function(){
			if($('#userName').val() === ''){
				$('#loginmsg').text("账号不为空!");
				$('.nousername').show();
				return false;
			}
			if($('#password').val() === ''){
                $('#loginmsg').text("密码不为空!");
                $('.nousername').show();
                return false;
			}
			$('login').submit();
		});
    });
}(jQuery));

后端控制器LoginController代码：

import org.springframework.web.servlet.ModelAndView;
import org.springframework.web.servlet.mvc.Controller;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

public class LoginController implements Controller {
    @Override
    public ModelAndView handleRequest(HttpServletRequest httpServletRequest, HttpServletResponse httpServletResponse) throws Exception {
        ModelAndView modelAndView = new ModelAndView();
        String userName = httpServletRequest.getParameter("userName");
        String password = httpServletRequest.getParameter("password");
        System.out.println("userName:" + userName);
        System.out.println("password:" + password);
        modelAndView.setViewName("dashboard");
        return modelAndView;
    }
}

运行的时候出现奇怪的现象，第一次能够顺利登入（url为http://localhost:10000/login.action），然而进行刷新时，出现如下的412错误，第三次又正常，第四次又是412：

解决方法一（修改表单提交方式为get）：

            <form id="login" action="login.action" method="get">
                <div class="username">
                    <div class="usernameinner">
                        <input type="text" name="userName" id="userName" placeholder="userName"/>
                    </div>
                </div>
                <div class="password">
                    <div class="passwordinner">
                        <input type="password" name="password" id="password" placeholder="password" />
                    </div>
                </div>
                <button id="loginSubmit">登录</button>
                <div class="keep"><input type="checkbox" /> 记住密码</div>
            </form>

解决方法二（清理缓存）：为response设置头信息，告诉浏览器不要缓存当前界面，不推荐使用。

response.setHeader( "Cache-Control" , "no-store" );   //no-cache不行，还是会缓存  
response.setDateHeader( "Expires" , 0);   
response.setHeader( "Pragma" , "no-cache" );

解决方法三（使用Ajax）：如果是使用Ajax来提交数据，那么可以使用<input type="button"/>来替代<button></button>，这样可以解决该问题，该方法未测试，有空补上。

参考资料：http://blog.csdn.net/qq_27851149/article/details/79505247

http://blog.csdn.net/qq_33376750/article/details/78120719?locationNum=5&fps=1

http://blog.csdn.net/phker/article/details/50722619