Laravel Ajax POST 请求中获取不到数据的解决方案-php教程-PHP中文网

Laravel Ajax POST 请求中获取不到数据的解决方案

本文详解 laravel 中通过 jquery ajax 发送 post 请求时控制器接收为 null 的常见原因及修复方法，涵盖 csrf 配置、选择器错误、数据序列化、路由与控制器规范等关键点。

本文详解 laravel 中通过 jquery ajax 发送 post 请求时控制器接收为 null 的常见原因及修复方法，涵盖 csrf 配置、选择器错误、数据序列化、路由与控制器规范等关键点。

在使用 jQuery Sortable 实现拖拽排序并同步更新数据库顺序时，常遇到 Laravel 控制器中 request->positions 为 null，进而触发 foreach() argument must be of type array|object, null given 错误。该问题并非逻辑缺陷，而是由多个典型配置疏漏共同导致。以下是系统性修复方案：

✅ 1. 修正 jQuery 选择器与数据收集逻辑

原代码中 $('updated') 是无效选择器（缺少点号），且变量名拼写错误（position.push(...) 应为 positions.push(...)）：

function saveNewPositions() {
    var positions = [];
    // ✅ 修正：使用 .updated 类选择器，并修复变量名
    $('.updated').each(function () {
        positions.push([
            $(this).data('index'),      // 推荐用 data() 获取 data-index
            $(this).data('position')    // 同理获取 data-position
        ]);
        $(this).removeClass('updated');
    });

    // ✅ 确保 CSRF Token 已注入页面（通常在  中）
    // <meta name="csrf-token" content="{{ csrf_token() }}">

    $.ajax({
        method: 'POST',
        url: '/cursos', // ✅ 建议加前导斜杠，确保路径准确
        dataType: 'json',
        data: {
            updated: 1,
            positions: positions, // ✅ 字段名需与控制器中 $request->positions 一致
            _token: $('meta[name="csrf-token"]').attr('content') // ✅ 优先从 meta 标签读取，避免 Blade 模板未渲染问题
        },
        success: function (response) {
            console.log('排序更新成功:', response);
        },
        error: function (xhr) {
            console.error('请求失败:', xhr.responseJSON?.message || xhr.statusText);
        }
    });
}

⚠️ 注意：$(this).attr('data-index') 在 HTML5 中推荐改用 $(this).data('index')，jQuery 会自动处理 data-* 属性的驼峰转换（如 data-position → position）。

✅ 2. 规范路由定义（避免闭包滥用）

web.php 中应使用标准控制器路由，而非匿名函数闭包，以保障依赖注入与中间件正常生效：

Laravel

避免常见的Laravel错误：N+1查询、批量赋值、缓存陷阱及队列序列化陷阱。

下载

// ✅ 推荐写法：绑定到控制器方法，自动应用 web 中间件（含 CSRF 验证）
Route::post('/cursos', [SectionCourseController::class, 'updateOrder'])->name('cursos.update.order');

✅ 3. 重构控制器方法（类型安全 + 异常防护）

原静态方法不符合 Laravel 最佳实践，且缺乏数据校验与异常兜底：

// app/Http/Controllers/SectionCourseController.php
use Illuminate\Http\Request;
use App\Models\SectionCourse;

public function updateOrder(Request $request)
{
    // ✅ 强制验证 positions 存在且为数组
    $request->validate([
        'positions' => 'required|array',
        'positions.*' => 'required|array|size:2',
        'positions.*.0' => 'required|integer', // index
        'positions.*.1' => 'required|integer|min:1', // new position
    ]);

    $positions = $request->input('positions');

    foreach ($positions as $position) {
        [$index, $newPosition] = $position; // ✅ PHP 7.1+ 解构赋值

        try {
            $section = SectionCourse::findOrFail($index);
            $section->order = $newPosition;
            $section->save();
        } catch (\Illuminate\Database\Eloquent\ModelNotFoundException $e) {
            \Log::warning("SectionCourse not found for index: {$index}");
            continue; // 跳过无效项，不中断整体更新
        }
    }

    return response()->json(['message' => '排序更新成功'], 200);
}

✅ 4. 补充 Sortable 初始化增强配置

提升拖拽体验与稳定性：

$('table tbody').sortable({
    axis: 'y',                // ✅ 仅允许垂直拖拽
    containment: 'parent',    // ✅ 限制在父容器内
    cursor: 'move',
    update: function (event, ui) {
        $(this).children().each(function (index) {
            const $row = $(this);
            const currentPos = parseInt($row.data('position')) || 0;
            if (currentPos !== index + 1) {
                $row.data('position', index + 1).addClass('updated');
            }
        });
        saveNewPositions();
    }
});