重定向到新页面

Question

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

在以下代码中：

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

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

这是我的 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 {
        }
    }
}

Answer 1

您可以尝试删除 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");
}