代码突发Uncaught SyntaxError: Unexpected end of JSON input错误求助

问题详情 #

报错信息：

Uncaught SyntaxError: Unexpected end of JSON input
at Function.parse [as parseJSON] ()
at Object.success (customers:606:38)
at c (jquery-3.6.0.min.js:2:28327)

错误出现在var res = jQuery.parseJSON(response)行，相关前端代码如下：

$(document).on('submit', '#saveCustomer', function (e) {
    e.preventDefault();

    var formData = new FormData(this);
    formData.append("save_customer", true);

    $.ajax({
        type: "POST",
        url: "code.php",
        data: formData,
        processData: false,
        contentType: false,
        success: function (response) {
            var res = jQuery.parseJSON(response);
            if(res.status == 422) {
                $('#errorMessage').removeClass('d-none');
                $('#errorMessage').text(res.message);
            }else if(res.status == 200){
                $('#errorMessage').addClass('d-none');
                $('#customerAddModal').modal('hide');
                $('#saveCustomer')[0].reset();
                alertify.set('notifier','position', 'top-right');
                alertify.success(res.message);
                $('#myTable').load(location.href + " #myTable");
            }else if(res.status == 500) {
                alert(res.message);
            }
        }
    });
});

原本代码运行正常，突然出现上述报错，已尝试搜索资料、添加.done方法，均无效。

排查与解决步骤 #

1. 优先检查后端code.php的输出 #

这个错误的核心原因是后端返回的内容不是合法JSON，甚至是空内容：

• 用Postman或浏览器开发者工具的Network面板，模拟POST请求（带上save_customer=true和表单其他参数），查看code.php的返回结果：
  • 如果返回空字符串：说明后端代码逻辑没有触发JSON输出，比如条件判断错误、代码执行到一半中断（比如PHP报错）。
  • 如果返回夹杂了PHP错误提示、HTML注释、调试输出（比如var_dump）：这些内容会破坏JSON结构，导致解析失败。
• 确保code.php最终只输出标准JSON，不要有任何多余字符，比如开头的空格、结尾的换行。可以在PHP开头加ob_clean()清空输出缓冲区，避免意外输出。

2. 前端添加调试与错误捕获 #

在ajax请求中加入调试代码和错误处理，先明确后端返回的实际内容：

$(document).on('submit', '#saveCustomer', function (e) {
    e.preventDefault();

    var formData = new FormData(this);
    formData.append("save_customer", true);

    $.ajax({
        type: "POST",
        url: "code.php",
        data: formData,
        processData: false,
        contentType: false,
        success: function (response) {
            // 先打印后端返回的原始内容，排查是否为合法JSON
            console.log('后端返回:', response);
            try {
                var res = jQuery.parseJSON(response);
                // 原有业务逻辑...
            } catch(e) {
                console.error('JSON解析失败:', e);
                alert('请求返回格式错误，请检查后端');
            }
        },
        // 捕获请求失败的情况（比如网络错误、后端500）
        error: function(xhr, status, err) {
            console.error('请求出错:', status, err);
            console.log('响应内容:', xhr.responseText);
        }
    });
});

通过console.log可以直接看到后端返回的内容，快速定位是为空、还是有非法字符。

3. 优化前端JSON解析方式 #

让jQuery自动处理JSON解析，避免手动调用parseJSON的风险：
给ajax请求添加dataType: 'json'配置，此时success回调的参数已经是解析好的JSON对象：

$.ajax({
    type: "POST",
    url: "code.php",
    data: formData,
    processData: false,
    contentType: false,
    dataType: 'json', // 新增配置，告诉jQuery期望返回JSON
    success: function (res) {
        // 直接使用res，无需手动解析
        if(res.status == 422) {
            $('#errorMessage').removeClass('d-none');
            $('#errorMessage').text(res.message);
        }else if(res.status == 200){
            // 原有逻辑...
        }
    },
    error: function(xhr) {
        console.error('请求或解析失败:', xhr.responseText);
    }
});

这种方式更可靠，jQuery会自动验证返回内容的格式，解析失败时会触发error回调。

4. 检查表单提交的异常数据 #

突然报错可能是某次提交的表单数据有特殊情况：

• 比如上传的文件过大，超过PHP配置的upload_max_filesize限制，导致后端报错中断。
• 表单输入包含特殊字符（比如未转义的引号），导致后端生成JSON时出错。
  可以在前端打印formData内容，或者在后端打印$_POST和$_FILES，排查是否有异常数据。

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