纯HTML网站向Laravel API提交数据失败，请求排查问题

1. 请求字段名与控制器接收的大小写不匹配 #

你在jQuery里定义的字段是小写开头：

inputs.fullname = $("#Fullname").val();
inputs.email = $("#Email").val();
// ... 其他字段均为小写开头

但控制器里用大写开头接收参数：

$v->FullName = $request->FullName;
$v->Email = $request->Email;
// ... 其他字段均为大写开头

Laravel的请求参数区分大小写，$request->FullName无法获取到前端传入的fullname值，最终要么存入空值（若字段允许为空），要么因字段非空约束保存失败却无异常提示。

解决方法：统一字段名大小写，比如将控制器接收逻辑改为：

$v->FullName = $request->fullname;
$v->Email = $request->email;
$v->Constituent = $request->constituent;
$v->Subject = $request->subject;
$v->Message = $request->message;

2. jQuery AJAX参数错误（returnType应为dataType） #

你的AJAX配置使用了returnType: "JSON"，但jQuery的AJAX无此参数，正确参数名为dataType。该错误虽不直接导致数据存储失败，但会影响响应解析，让你无法获取后端真实错误信息。

解决方法：修改AJAX配置，同时优化错误回调的信息输出：

$.ajax({
    url: "http://127.0.0.1:8000/api/complaints/",
    type: "POST",
    data: inputs,
    dataType: "JSON", // 替换returnType为dataType
    success: function(response) {
        alert("Complaint sent!");
    },
    error: function(xhr, status, error) {
        // 打印详细错误到控制台，方便排查
        console.log(xhr.responseText);
        alert("Error: " + error);
    }
});

3. 控制器未处理保存结果与返回响应 #

当前控制器仅执行$v->save()，未检查保存是否成功，也未返回任何响应。即使保存失败（如违反数据库约束），HTTP状态码仍为200，jQuery会触发success回调，让你误以为请求成功。

解决方法：在控制器中添加字段验证、保存结果校验与响应返回：

public function store(Request $request)
{
    // 先验证必填字段，自动返回错误响应
    $validated = $request->validate([
        'fullname' => 'required|string',
        'email' => 'required|email',
        'constituent' => 'required|string',
        'subject' => 'required|string',
        'message' => 'required|string',
    ]);

    $v = new Feedback;
    $v->FullName = $validated['fullname'];
    $v->Constituent = $validated['constituent'];
    $v->Email = $validated['email'];
    $v->Subject = $validated['subject'];
    $v->Message = $validated['message'];

    if ($v->save()) {
        return response()->json(['status' => 'success', 'message' => 'Complaint saved'], 201);
    } else {
        return response()->json(['status' => 'error', 'message' => 'Failed to save complaint'], 500);
    }
}

4. 跨域资源共享（CORS）问题 #

若HTML页面与Laravel API不在同一域名/端口（比如HTML在localhost:8080，API在localhost:8000），浏览器会触发跨域限制，可能导致请求被拦截或数据未正确发送。

解决方法：在Laravel中配置CORS支持：

1. 安装扩展：composer require fruitcake/laravel-cors
2. 发布配置文件：php artisan vendor:publish --tag="cors"
3. 修改config/cors.php，允许前端域名：

'paths' => ['api/*'],
'allowed_origins' => ['http://localhost:8080'], // 替换为你的HTML页面地址
'allowed_methods' => ['POST', 'GET', 'OPTIONS'],
'allowed_headers' => ['*'],

5. 数据库字段约束问题 #

检查feedbacks表（假设模型对应此表）的字段约束，比如FullName、Email是否设置为NOT NULL。若因字段名不匹配导致赋值为空，保存时会违反约束，但Laravel默认不会主动抛出异常，导致数据存不上却无报错。

解决方法：查看数据库表结构，确保字段约束与传入数据匹配，同时在控制器中添加异常捕获：

try {
    $v->save();
    return response()->json(['status' => 'success'], 201);
} catch (\Exception $e) {
    return response()->json(['status' => 'error', 'message' => $e->getMessage()], 500);
}

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