You need to enable JavaScript to run this app.
最新活动
大模型
产品
解决方案
定价
生态与合作
支持与服务
开发者
了解我们

如何调试WordPress后台出现的JSON无效响应错误?

调试Gutenberg编辑器“无效JSON响应”问题的具体步骤

你遇到的这个问题很典型——表面是JSON响应错误,但PHP调试日志没记录,说明问题可能出在响应内容被污染或者前端/JSON编码环节,下面给你一步步的调试方案:

1. 先从浏览器Network日志挖核心线索

你已经抓了两次保存请求的日志,这是最关键的第一步,重点看这几个细节:

  • 查看错误请求的响应体:找到保存页面的POST请求(一般路径是wp-json/wp/v2/pages/[你的页面ID]),切换到「Response」标签,哪怕状态码是200,也可能混了非JSON内容(比如PHP警告的HTML、多余的空格/换行、主题/插件输出的调试信息)——这些内容会让浏览器无法解析成有效JSON,就是你看到的错误。
  • 对比请求参数:把正常页面和错误页面的「Payload」里的content字段做对比,看第三方区块的JSON数据有没有异常(比如包含未转义的引号、特殊控制字符、非UTF-8编码的字符)。
  • 检查响应头:确认响应的Content-Typeapplication/json,如果变成text/html或者其他类型,说明服务器端输出了非JSON内容。

2. 修复并正确使用JSON错误检测代码

你找到的那段json_last_error_msg代码本身没问题,但直接放到PHP文件访问是没用的——它需要在WordPress处理REST API请求的上下文里运行,才能捕获JSON编码/解码的错误。把下面的代码放到你的主题functions.php或者wp-config.php底部:

if (!function_exists('json_last_error_msg')) {
    function json_last_error_msg() {
        static $ERRORS = array(
            JSON_ERROR_NONE => 'No error',
            JSON_ERROR_DEPTH => 'Maximum stack depth exceeded',
            JSON_ERROR_STATE_MISMATCH => 'State mismatch (invalid or malformed JSON)',
            JSON_ERROR_CTRL_CHAR => 'Control character error, possibly incorrectly encoded',
            JSON_ERROR_SYNTAX => 'Syntax error',
            JSON_ERROR_UTF8 => 'Malformed UTF-8 characters, possibly incorrectly encoded'
        );
        $error = json_last_error();
        return isset($ERRORS[$error]) ? $ERRORS[$error] : 'Unknown error';
    }
}

// 钩子到REST API响应发送前,记录JSON错误到debug.log
add_action('rest_api_init', function() {
    add_filter('rest_pre_echo_response', function($response, $result, $request) {
        $json_error = json_last_error_msg();
        if ($json_error !== 'No error') {
            // 确保已经开启WP_DEBUG_LOG,错误会写入wp-content/debug.log
            error_log('[REST JSON Error] ' . $json_error . ' | 请求路径: ' . $request->get_route());
        }
        return $response;
    }, 10, 3);
});

同时确保wp-config.php里已经开启日志:

define('WP_DEBUG', true);
define('WP_DEBUG_LOG', true);
define('WP_DEBUG_DISPLAY', false); // 禁止错误输出到浏览器,避免污染响应

触发错误后,去wp-content/debug.log里找对应的错误信息,就能知道是JSON编码时的具体问题(比如UTF-8字符错误、栈深度超限)。

3. 针对性排查第三方区块

既然问题只出在特定第三方区块,重点排查它的两个核心点:

  • 区块的服务器端渲染(SSR)代码:有些区块会用PHP做服务器端渲染,如果代码里有echovar_dump或者未处理的错误输出,会直接混入REST API的JSON响应里,导致解析失败。可以临时禁用该区块的SSR功能(看区块设置或者代码里的render_callback),测试是否还报错。
  • 区块保存时的JSON数据:检查区块在Gutenberg编辑器里生成的内容,有没有包含特殊字符(比如不可见的控制字符、非标准UTF-8的 emoji),这些会导致JSON编码失败。可以尝试删除区块里的特殊内容,逐步缩小范围找到问题字符。

4. 检查服务器端的输出污染

有时候问题不在WordPress代码,而是服务器的配置:

  • 检查php.ini里的output_buffering是否开启,如果关闭,任何意外的输出(比如主题文件开头的空格、插件里的echo)都会直接混入响应。
  • 检查是否有服务器级别的错误处理脚本,会把PHP错误转换成HTML输出,污染JSON响应。可以在wp-config.php开头添加ob_start();强制开启输出缓冲,避免多余内容提前输出。

按照这个顺序排查,你应该能快速定位到问题根源——大多数情况下,都是某个地方输出了多余的字符,或者区块的JSON数据有编码问题。

内容的提问来源于stack exchange,提问作者Johnny586

火山引擎 最新活动