一尘不染

如何在 jQuery Ajax 调用后管理重定向请求

javascript

$.post()使用 Ajax 调用 servlet,然后使用生成的 HTML 片段替换div用户当前页面中的元素。但是,如果会话超时,服务器会发送重定向指令将用户发送到登录页面。在这种情况下,jQuery 正在将div元素替换为登录页面的内容,迫使用户的眼睛确实见证了一个罕见的场景。

如何使用 jQuery 1.2.6 管理来自 Ajax 调用的重定向指令?


阅读 174

收藏
2022-02-23

共2个答案

一尘不染

我通过以下方式解决了这个问题:

  1. 向响应中添加自定义标头:

js public ActionResult Index(){ if (!HttpContext.User.Identity.IsAuthenticated) { HttpContext.Response.AddHeader("REQUIRES_AUTH","1"); } return View(); }

  1. 将 JavaScript 函数绑定到ajaxSuccess事件并检查标头是否存在:

js $(document).ajaxSuccess(function(event, request, settings) { if (request.getResponseHeader('REQUIRES_AUTH') === '1') { window.location = '/'; } });

2022-02-23
一尘不染

我阅读了这个问题并实施了关于将响应HTTP 状态代码设置为 278 的方法,以避免浏览器透明地处理重定向。即使这有效,我还是有点不满意,因为它有点像黑客。

经过更多的挖掘,我放弃了这种方法并使用了JSON。在这种情况下,对 AJAX 请求的所有响应都具有状态代码200,并且响应的主体包含在服务器上构造的 JSON 对象。然后客户端上的 JavaScript 可以使用 JSON 对象来决定它需要做什么。

我遇到了和你类似的问题。我执行了一个 AJAX 请求,它有 2 个可能的响应:一个将浏览器重定向到新页面,另一个将当前页面上的现有 HTML 表单替换为新表单。执行此操作的 jQuery 代码如下所示:

$.ajax({
    type: "POST",
    url: reqUrl,
    data: reqBody,
    dataType: "json",
    success: function(data, textStatus) {
        if (data.redirect) {
            // data.redirect contains the string URL to redirect to
            window.location.href = data.redirect;
        } else {
            // data.form contains the HTML for the replacement form
            $("#myform").replaceWith(data.form);
        }
    }
});

JSON 对象“数据”在服务器上构造为具有 2 个成员:data.redirectdata.form. 我发现这种方法要好得多。

2022-02-23