ASP.NET MVC中的AJAX请求与重定向

最新推荐文章于 2025-09-09 22:18:29 发布

原创最新推荐文章于 2025-09-09 22:18:29 发布 · 402 阅读

4 ·

CC 4.0 BY-SA版权

文章标签：

#asp.net #mvc #后端 #个人开发

在ASP.NET MVC项目中处理AJAX请求时，经常会遇到一些有趣的问题，比如重定向不生效的情况。今天我们来探讨一下这个常见的问题，并通过一个实例来解释如何解决。

问题描述

假设我们正在开发一个HR系统，其中有一个功能是批准员工的离职请求。在这个场景中，我们有两个动作：

ApprovalIndex：用于批准请求并更新数据库。
PendingManagersRequests：显示待处理的请求列表。

当点击“Approve”按钮时，我们希望在批准后自动跳转到待处理请求列表页面。但是，在使用AJAX调用ApprovalIndex后，页面没有进行重定向，而是显示了“localhost says”弹窗。

代码分析

首先，让我们看一下相关的代码：

public class ResignationController : Controller
{
    [HttpPost]
    public async Task<ActionResult> ApprovalIndex(ResignationRequester REQ)
    {
        string errorMsg = string.Empty;
        string requestStatus;
        Workforce.ResignationUpdateLineManangerApproval(id, true, Convert.ToInt32(Session[SessionKeys.UserCode]));
        return RedirectToAction("PendingManagersRequests", new { msg = $"Request NO {REQ.RequestNo} has been accepted successfully." });
    }
}

在客户端，AJAX调用如下：

function submit() {
    var ResignationRequester = new Object();
    // ... 省略了一些代码 ...
    if (ResignationRequester != null) {
        $.ajax({
            type: "POST",
            url: '@Url.Action("ApprovalIndex", "Resignation")',
            data: JSON.stringify(ResignationRequester),
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (response) {
                console.log(response);
            },
            // ... 错误处理代码 ...
        });
    }
}

问题原因

问题的核心在于AJAX请求无法处理服务器端的重定向。AJAX请求会在后台完成所有操作，但不会改变浏览器的当前URL或页面内容。因此，当服务器返回RedirectToAction时，客户端并不会自动跳转。

解决方案

解决这个问题的关键是在客户端手动处理重定向。我们可以在AJAX请求成功后的回调函数中进行页面跳转：

function submit() {
    var ResignationRequester = new Object();
    // ... 省略了一些代码 ...
    if (ResignationRequester != null) {
        $.ajax({
            type: "POST",
            url: '@Url.Action("ApprovalIndex", "Resignation")',
            data: JSON.stringify(ResignationRequester),
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (response) {
                console.log(response);
                // 手动重定向到目标页面
                window.location = "/Resignation/PendingManagersRequests?msg=Request has been approved successfully.";
            },
            // ... 错误处理代码 ...
        });
    }
}