WordPress激活模态框时AJAX请求遇HTTP 400错误问题排查

针对你遇到的WordPress AJAX请求返回400错误的问题，结合你的代码给出以下具体排查和解决步骤：

1. 添加CSRF Nonce验证（最常见原因） #

WordPress默认会对AJAX请求进行CSRF校验，缺失nonce是导致400错误的核心原因之一。需要在前后端同时处理nonce：

前端修改： #

首先在PHP中注册脚本时传递nonce到JS对象：

wp_enqueue_script('fluxo-ajax-script', get_template_directory_uri() . '/js/your-script.js', array('jquery'), '1.0', true);
wp_localize_script('fluxo-ajax-script', 'fluxoAjax', array(
    'ajax_url' => admin_url('admin-ajax.php'),
    'nonce' => wp_create_nonce('fluxo_details_nonce') // 生成并传递nonce
));

然后在AJAX请求的data参数中加入nonce：

var data = {
    action: 'get_fluxo_details',
    type: type,
    month: month,
    nonce: fluxoAjax.nonce // 新增nonce参数
};

后端验证： #

在回调函数开头添加nonce校验逻辑：

function get_fluxo_details_callback() {
    // 验证nonce有效性
    if (!wp_verify_nonce($_POST['nonce'], 'fluxo_details_nonce')) {
        wp_die('Invalid request');
    }

    // 安全获取并过滤POST参数
    $type = isset($_POST['type']) ? sanitize_text_field($_POST['type']) : '';
    $month = isset($_POST['month']) ? sanitize_text_field($_POST['month']) : '';

    // 检查必要参数是否存在
    if (empty($type) || empty($month)) {
        wp_die('Missing required parameters');
    }

    // 你的数据获取与处理逻辑...
    $response = '替换为实际返回的详情内容';

    echo $response;
    wp_die(); // 必须用wp_die()终止请求
}
add_action('wp_ajax_get_fluxo_details', 'get_fluxo_details_callback');
add_action('wp_ajax_nopriv_get_fluxo_details', 'get_fluxo_details_callback');

2. 确认Action名称完全匹配 #

检查前端action字段的值'get_fluxo_details'与后端钩子wp_ajax_xxx、wp_ajax_nopriv_xxx中的后缀是否完全一致（WordPress钩子大小写敏感），确保无拼写错误。

3. 检查回调函数注册位置 #

确保add_action代码放在主题的functions.php或插件主文件中，未被其他代码覆盖或移除。

4. 验证请求内容类型 #

确保AJAX请求使用默认的application/x-www-form-urlencoded内容类型，若之前修改过全局AJAX设置，可恢复默认：

$.ajaxSetup({
    contentType: 'application/x-www-form-urlencoded; charset=UTF-8'
});

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