Ajax大负载GET请求阻塞网站路由问题求助

前端层面：主动中止未完成的Ajax请求 #

你需要先保存Ajax请求的jqXHR实例，在用户触发页面跳转时主动取消请求，避免浏览器等待响应完成再执行跳转：

// 全局存储未完成的请求实例
let pendingAjax;

$(window).on('load', function () {
    // 保存请求对象
    pendingAjax = $.ajax({
        url: '@Url.Action(controllerUrl)',
        type: 'GET',
        dataType: 'json',
        async: true,
        success: function (data) {
            console.log('Received data:', data);
            if (data.success && data.yy.length > 0) {
                var html = '';
                // DOM生成逻辑
            }
        },
        error: function(xhr){ 
            // 区分主动中止和真实错误，避免生成错误提示
            if(xhr.statusText !== 'abort'){
                // 生成错误相关DOM
            }
        }
    });
});

// 监听页面卸载事件，取消未完成请求
$(window).on('beforeunload', function() {
    if (pendingAjax && pendingAjax.readyState !== 4) {
        pendingAjax.abort();
    }
});

// 针对站内跳转的链接/按钮，提前触发请求取消
$('a[href^="/"], button[data-url^="/"]').on('click', function() {
    if (pendingAjax && pendingAjax.readyState !== 4) {
        pendingAjax.abort();
    }
});

后端层面：真正实现异步非阻塞处理 #

你提到后端几乎仍为同步运行，这是服务器端阻塞的核心原因——前端取消请求只能解决浏览器层面的等待，但服务器仍会继续处理已发起的请求，浪费资源的同时，后续请求可能仍被队列阻塞。

需要将后端的同步逻辑改为异步处理：

• 若使用ASP.NET（从@Url.Action判断），用async/await改写控制器方法，确保数据库查询、IO操作等耗时步骤不会占用线程池线程等待。
• 对于复杂的数据关联计算，可将耗时任务放入后台队列（比如Hangfire），前端通过轮询或SignalR接收结果，彻底释放请求线程。

内容的提问来源于stack exchange，提问作者Simon