重定向到新页面

时间:2020-12-28 23:34:55

标签: java jquery ajax servlet-3.0 jquery-easyui

我的“login.html”中有一个表单,单击“登录”按钮后,该表单将提交到我的 java 后端代码。但是,我不知道如何将我的登录页面重定向到新页面。

在以下代码中:

<script>
        $(function() {
           $('#ff').form({
               url: "LoginServlet",
               success:function(data){
                   $.messager.alert(data);
               }
           });
        });
    </script>

在成功部分,我重定向的页面将显示在此消息窗口中。但是我希望它跳转到servlet返回的页面。

enter image description here

这是我的 login.html 代码:

<!DOCTYPE html>
<html lang="en">
<head>
    <script>
        $(function() {
           $('#ff').form({
               url: "LoginServlet",
               success:function(data){
                   $.messager.alert(data);
               }
           });
        });
    </script>
</head>
<body>
    <form id="ff" role="form" method="post">
        <div>
            <h1>User Login</h1>
        </div>
        <div>
            <input id="username" name="username" class="easyui-textbox" data-options="iconCls:'icon-man',iconWidth:30,iconAlign:'left',prompt:'Username'" style="width:100%;height:35px;" />
        </div>
        <div>
            <input id="password" name="password" class="easyui-passwordbox" data-options="iconWidth:30,iconAlign:'left',prompt:'Password'" style="width:100%;height:35px;" />
        </div>
        <div>
            <a href="javascript:void(0)" class="easyui-linkbutton" onclick="$('#ff').submit()" style="width:100%;height:35px;">Submit</a>
        </div>
        <div>
            <div style="display:inline;">
                <a href="javascript:void(0)">Register</a>
            </div>
        </div>
    </form>
</body>
</html>

这是我的 java servlet 代码:

@WebServlet("/LoginServlet")
public class LoginServlet extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        doGet(request, response);
    }

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        request.setCharacterEncoding("UTF-8");
        response.setContentType("text/html;charset=UTF-8");
        String username = request.getParameter("username");
        String password = request.getParameter("password");
        IUserService userService = new UserServiceImpl();
        User user = userService.login(username, password).get(0);

        if (user != null) {
            response.sendRedirect(request.getContextPath() + "/index.jsp");
        } else {
        }
    }
}

1 个答案:

答案 0 :(得分:2)

您可以尝试删除Javascript函数并使用表单操作直接调用jsp。

所以我会删除以下部分

<script>
        $(function() {
           $('#ff').form({
               url: "LoginServlet",
               success:function(data){
                   $.messager.alert(data);
               }
           });
        });
    </script>

由于您拥有的结构,这里的这部分需要删除。大多数使用 JSP 的项目都具有这种结构。

您希望在第一步中获取所有表单参数并访问 url .../LoginServlet。

然后,当您构建 servlet 时,它会进行身份验证,如果成功,它会向您的浏览器发送一条消息并说:请浏览器将这些标头保留在 http 消息中,但请访问另一个 URL (index.jsp) 以查看您的内容等等。

如您所见,客户端(又名浏览器)在不同的 URL 之间移动以提供服务。

这就是为什么那个简单的 Javascript 函数不能按预期工作的原因。

所以一个简单的解决方案是直接在表单操作中进行调用

<body>
    <form id="ff" role="form" method="post" action="/LoginServlet">
    ....

如果身份验证不成功,那么我将从我的 servlet 提供一个错误页面。

if (user != null) {
            response.sendRedirect(request.getContextPath() + "/index.jsp");
        } else {
            response.sendRedirect(request.getContextPath() + "/error.html");
}
相关问题