Vue通过axios请求WordPress接口响应仅返回0，如何获取正确数据

问题排查与修复步骤 #

1. 修正PHP侧响应输出逻辑 #

WordPress admin-ajax.php 规则为：处理完钩子逻辑后如果没有主动输出内容，默认返回0。你当前用return返回JSON属于函数返回值，不会输出到响应体，同时存在PHP数组语法错误（键值分隔符应为=>而非:）。
修改PHP代码如下：

// 声明响应格式为JSON
header('Content-Type: application/json');
// 输出JSON内容
echo json_encode(['status' => 200, 'user_id' => '123kl-234op-12390']);
// 终止后续执行，避免WordPress自动追加输出
wp_die();

2. 确认AJAX钩子完整注册 #

WordPress AJAX需要为登录/未登录用户分别注册钩子，缺少对应钩子会直接返回0。在主题functions.php或自定义插件中补充注册逻辑：

// 登录用户请求触发钩子
add_action('wp_ajax_form_handler', 'form_handler_callback');
// 未登录用户请求触发钩子
add_action('wp_ajax_nopriv_form_handler', 'form_handler_callback');

function form_handler_callback() {
    // 你的业务逻辑代码
    header('Content-Type: application/json');
    echo json_encode(['status' => 200, 'user_id' => '123kl-234op-12390']);
    wp_die();
}

3. 修正前端Axios请求配置 #

你当前错误地将headers配置放入了请求体参数中，同时前端不需要主动发送Access-Control-Allow-Origin头（该头由后端返回），且dataType是jQuery的参数，Axios对应参数为responseType。修改前端代码如下：

this.axios.post(ajaxurl, 
    qs.stringify({
        action: 'form_handler',
        form: this.form
    }),
    // Axios配置项作为第三个参数传入
    {
        headers: {
            'Content-Type': 'application/x-www-form-urlencoded'
        },
        responseType: 'json'
    }
)
.then(function(response) {
    console.log('success')
    console.log(response)
})
.catch(function (error) {
    console.log('error')
    console.log(error)
})

完成以上修改后即可拿到你预期的响应格式。

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