Ajax调用PHP接口遇JSON解析错误：SyntaxError: "[object Object]"

核心问题分析 #

你的代码有两处关键错误，导致了JSON解析失败：

1. jQuery Ajax已自动完成JSON解析，无需重复调用JSON.parse
   当你设置dataType: "json"时，jQuery会自动将服务器返回的JSON字符串解析为JavaScript对象。此时success回调里的data已经是解析好的对象，再执行JSON.parse(data)会把对象强制转为字符串"[object Object]"，对这个无效JSON字符串解析自然报错。

2. error回调参数使用错误
   error回调的第一个参数是jqXHR对象（不是响应文本），直接对它执行JSON.parse(data)同样会把对象转为"[object Object]"，触发解析错误。

修正后的JavaScript代码 #

$(() => {
    $('.login-form').on('submit', function (e) {
        e.preventDefault();

        $.ajax({
            type: "POST",
            dataType: "json",
            timeout: 500,
            url: '/src/login.php',
            data: $(this).serialize(),

            success: (data) => {
                // data已经是解析好的JSON对象，直接使用
                console.log(data);
                // 可直接访问success属性处理业务逻辑
                if (data.success === 1) {
                    // 登录成功操作
                } else {
                    // 登录失败操作
                }
            },
            error: (jqXHR, textStatus, errorThrown) => {
                // 错误信息打印
                console.log('请求错误:', textStatus, errorThrown);
                // 如需查看响应原始内容，使用jqXHR.responseText
                console.log('响应文本:', jqXHR.responseText);
            }
        });
    });
});

PHP端补充优化建议 #

为了确保JSON响应的纯净性，避免额外输出破坏格式，可做以下调整：

<?php 
include('init.php');
use Login\LoginService;

global $pdo;
session_start();

// 避免未定义索引警告
$username = $_POST['username'] ?? '';
$pass = $_POST['password'] ?? '';

if (!empty($username)) {
    $test = new LoginService();
    $user = $test->getUsersLogin($username);
    
    $response = ["success" => !empty($user) && $user[0]['login'] == $username ? 1 : 0];
    // 设置正确的响应头，明确告知客户端返回JSON格式
    header('Content-Type: application/json');
    echo json_encode($response);
    // 终止脚本，防止后续代码输出多余内容
    exit;
}
?>

• 检查init.php是否有多余输出（比如空格、HTML标签），这些内容会污染JSON响应，导致解析失败。
• 用header('Content-Type: application/json')明确响应类型，帮助客户端正确识别数据格式。

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