Question

我有一个简单的登录来测试AJAX

Heres my snippnet：

<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Login Test Page</title>
<script src="../js/jquery-1.10.1.min.js" ></script>
<script type="text/javascript">
$('input[type="submit"]').click(function(e) {
    e.preventDefault();
    var action_script = $(this).closest('form1').prop('action');
    $.post(action_script, {
        userName : $(this).closest('form1').find('input[name="userName"]'),
        password : $(this).closest('form1').find('input[name="password"]')
    }, function(returned_data) {
        //this part executes once the server returns a successful response
        alert("Please fill UserName & Password!");
    });
});
</script>
</head>
<body>
    <form action="LoginController" method="post">
        <!-- Login body -->
        <table>
            <tr>
                <td><label for="userName">Username:</label></td>
                <td><input type="text" name="userName" /></td>
            </tr>
            <tr>
                <td><label for="password">Password:</label></td>
                <td><input type="password" name="password" /></td>
            </tr>
            <tr>
                <td><input type="submit" /></td>
            </tr>
        </table>
    </form>
</body>

和控制器

UserDAO userDAO = new UserDAO(); // instantiate database

        String userName = request.getParameter( "userName" ); // get userName String from the Login.jsp
        String password = request.getParameter( "password" ); // get password String from the Login.jsp

        if( userDAO.authenticate( userName, password ) ) // validate userName and password
        {

            UserModel userModel = userDAO.getUserDetails( userName ); // get userModel that correspond to userName parameter

            request.getSession().setAttribute( "userName", userName ); // set SESSION REQUEST to be forward to MainPage.jsp
            request.setAttribute( "userDetails", userModel ); // set REQUEST to be forward to MainPage.jsp

            RequestDispatcher rd = request.getRequestDispatcher( "MainPage.jsp" );
            rd.forward( request, response ); // forward request to MainPage.jsp
            return;
        }
        else
        {
            response.sendRedirect( "Login.jsp" );
            return;
        }

我想要做的是如果登录失败，我想保留用户名和密码来测试AJAX如何工作，如果可能的话，还要测试JSON，但我还不知道我应该在哪里实施JSON来测试它。

我不知道我做错了什么，这是我第一次进行网页开发，请指导我。

Answer 1

这里的主要问题是服务器返回的内容。您希望它返回JSON个对象，但它会返回一个网页（最有可能是HTML）。

我在这里看到两个选项中的一个（可能更多，但我现在无法想到它们）：

您可以为JSON帖子（例如action_script + ".json"）设置单独的网址，并在控制器中分离用于验证用户凭据的逻辑，而不是将结果返回给浏览器的逻辑。也就是说，代替一种方法，有三种方法：（a）验证用户凭证的内部方法，（b）调用（a）和返回HTML或重定向的公共方法，以及（c）公共方法调用（a）并返回JSON对象的方法。
或者，您可以检测您收到的帖子类型以查找XHR个请求（和/或检查请求的标头以查找＆＃34;应用程序的内容类型/ json＆＃34;）并在这些情况下输出JSON对象。

实现取决于您以及您希望应用程序的灵活性。

基本的JSP，JSON和AJAX实现

1 个答案: