文件上传进度条干扰Controller重定向功能的问题如何解决？

• 你使用ajaxForm插件将默认的表单同步提交改为了异步AJAX提交，后端返回的302重定向只会被AJAX请求内部处理，浏览器不会触发全局页面跳转，因此页面不会自动加载带下载链接的新内容
• 原有代码中的window.location.href="/"属于无状态强制跳转，会触发全新的HTTP请求，Laravel的session闪存数据默认仅在第一个请求生命周期内有效，新请求无法拿到闪存的link参数
• 删除跳转代码后页面无变化，是因为异步请求完成后默认不会刷新页面，前端仍停留在提交前的旧页面
• 额外注意：你的HTML代码中文件选择框的id和对应label的for属性使用了中文双引号，会导致文件选择关联失效，需要先修正为英文双引号

方案1：最小改动适配原有逻辑（保留服务端闪存+页面刷新逻辑） #

改动量最小，无需大幅调整原有逻辑。

第一步 修改FileController #

public function store(Request $request)
{
    // 原有文件处理逻辑
    $link = "https://example.com";
    session()->flash("link",$link);
    // 异步请求直接返回200，不做重定向，避免闪存数据被重定向请求提前消耗
    if ($request->ajax()) {
        return response()->noContent();
    }
    // 兼容普通同步提交场景
    return redirect()->back();
}

第二步 修改JS回调 #

complete: function(xhr) {
    document.getElementById("progressBar").style.display = "none";
    document.getElementById('uploadButton').disabled = false;
    // 替换原有硬跳转，刷新页面即可读取session中留存的闪存数据
    window.location.reload();
}

方案2：无刷新体验优化（推荐） #

无需跳转页面，上传完成后直接展示下载链接，用户体验更好。

第一步 修改FileController #

public function store(Request $request)
{
    // 原有文件处理逻辑
    $link = "https://example.com";
    // 异步请求直接返回下载链接
    if ($request->ajax()) {
        return response()->json([
            'link' => $link
        ]);
    }
    // 兼容普通同步提交场景
    session()->flash("link",$link);
    return redirect()->back();
}

第二步 修改JS回调 #

complete: function(xhr) {
    document.getElementById("progressBar").style.display = "none";
    document.getElementById('uploadButton').disabled = false;
    const res = xhr.responseJSON;
    // 直接在当前页面插入下载链接，无需跳转刷新
    if (res?.link) {
        // 可根据需求调整插入位置和样式
        $('form').after(`<div class="alert alert-success mt-3">上传完成，<a href="${res.link}" download>点击下载文件</a></div>`);
    }
}

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