Laravel控制器AJAX分页请求始终返回第1页结果问题

问题背景 #

实现用户搜索功能，基础搜索与Laravel分页正常，但添加AJAX无限滚动后，控制器始终返回第1页结果，排查发现$request->input('page')为空。

错误原因 #

观察构造的AJAX请求URL：

http://127.0.0.1:8000/search?interestedin=Sugar+Mommy&...&longitude=74.397301?page=2

URL中出现两个问号?，第二个?会被浏览器当作普通字符处理，导致page参数无法被Laravel的Request正确解析，后端只能使用默认值1。

修复方案 #

前端代码修复 #

核心是正确拼接分页参数，避免重复使用?，推荐用URLSearchParams管理查询参数，确保参数拼接逻辑正确：

<script>
    var ENDPOINT = "{{ route('search') }}";
    var isLoading = false;
    var currentPage = 1;
    var totalPages = "{{ $users->lastPage() }}";
    // 保留原搜索条件的查询参数
    var searchParams = new URLSearchParams(window.location.search);

    $(window).scroll(function() {
        var container = $("#user-cards-container");
        var containerHeight = container.height();
        var scrollTop = $(window).scrollTop();
        var windowHeight = $(window).height();

        if (!isLoading && currentPage < totalPages && scrollTop + windowHeight >= container.offset().top + containerHeight - 20) {
            currentPage++;
            infinteLoadMore(currentPage);
        }
    });

    function infinteLoadMore(page) {
        // 更新分页参数
        searchParams.set('page', page);
        var url = ENDPOINT + '?' + searchParams.toString();
        console.log("Constructed URL: " + url);
        
        isLoading = true;
        $.ajax({
                url: url,
                datatype: "html",
                type: "get",
                beforeSend: function() {
                    $('.auto-load').show();
                }
            })
            .done(function(response) {
                if (!response.html) {
                    $('.auto-load').html("No more data to display.");
                    isLoading = false;
                    return;
                }

                $('.auto-load').hide();
                $("#user-cards-container").append(response.html);
                // 可选：更新总页数（适配搜索结果总数变化的场景）
                if (response.lastPage) {
                    totalPages = response.lastPage;
                }
                isLoading = false;
            })
            .fail(function(jqXHR, ajaxOptions, thrownError) {
                console.log('Server error occurred');
                isLoading = false;
            });
    }
</script>

后端代码优化（可选） #

后端原有逻辑可行，可简化分页参数处理，Laravel的paginate方法会自动从Request中获取page参数并使用默认值1：

public function search(Request $request)
{
    $query = User::query()
        ->where('id', '!=', Auth::id()) // 排除已认证用户
        ->where('status', '!=', 0); // 排除被封禁用户

    // 原有过滤逻辑保持不变...

    // 无需手动传入$page，paginate自动处理参数
    $users = $query->paginate(9);

    if ($request->ajax()) {
        $view = view('user.member_card', compact('users'))->render();
        return response()->json([
            'html' => $view,
            'lastPage' => $users->lastPage()
        ]);
    }

    return view('user.search', compact('users'));
}

额外注意点 #

• 确保member_card.blade.php仅渲染用户卡片列表，不包含外层容器，避免重复添加结构
• 可根据页面实际布局调整滚动触发的阈值，避免误触发加载

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