WordPress自定义插件仅移动端报400 Bad Request错误求助

核心问题分析 #

移动端返回400 Bad Request且PHP返回值为0，通常是WordPress AJAX请求未通过权限校验、参数解析错误或请求格式不兼容导致的，以下是具体修复步骤：

1. 修复非登录用户访问权限 #

WordPress默认的wp_ajax_{action}钩子仅对已登录用户生效，移动端用户大概率处于未登录状态，因此必须添加wp_ajax_nopriv_{action}钩子：

add_action( 'wp_ajax_receive_api_call', 'recieveAPICall' );
add_action( 'wp_ajax_nopriv_receive_api_call', 'recieveAPICall' ); // 新增：允许非登录用户请求

2. 修正PHP参数安全处理 #

直接使用$_POST["distance"]和$_POST["zip"]未做存在性检查，若移动端参数传递异常会触发PHP警告，导致请求终止。优化参数获取逻辑：

function recieveAPICall() { 
    // 安全获取并格式化参数
    $dist = isset($_POST["distance"]) ? intval($_POST["distance"]) : 25;
    $dist = min($dist, 50); // 简化距离限制逻辑
    
    $zip = isset($_POST["zip"]) ? sanitize_text_field($_POST["zip"]) : '';
    if(empty($zip)){
        echo json_encode(['error' => 'Zip code is required']);
        wp_die(); // 用wp_die()替代die，符合WordPress规范
    }
    
    $api_key_text = get_option('key_text');
    // 对URL参数编码，避免特殊字符破坏请求结构
    $api_url = sprintf(
        'http://some_url_i_am_using/endpoint?zip=%s&distance=%d',
        urlencode($zip),
        $dist
    );
    
    // 改用wp_remote_post，wp_safe_remote_post可能拦截HTTP协议请求
    $response = wp_remote_post($api_url, array(
        'headers' => array('X-API-Key' => $api_key_text)
    ));

    if (is_wp_error($response)) {
        echo json_encode(['error' => $response->get_error_message()]);
    } else {
        // 直接返回API原始响应体，避免双重JSON编码
        echo $response['body'];
    }
    wp_die();
}

3. 优化JavaScript请求逻辑 #

移动端对请求格式更敏感，移除不必要的参数并修正数据类型：

var zip = $("#ffl_zip").val().trim();
var dist = $("#ffl_distance").val();

// 修正距离参数为数字类型，避免字符串比较异常
dist = dist ? parseInt(dist, 10) : 25;
if(dist >= 50){
    dist = 50;
    $("#ffl_distance").val(50);
}

if(!zip){
    alert("Please enter a zip code to search.");
    return;
}

// 移除enctype参数：$.post默认使用application/x-www-form-urlencoded，无需强制指定multipart
var data = {
    "action":"receive_api_call", 
    "zip":zip, 
    "distance":dist
};

// 确保ajaxurl正确加载，建议通过wp_localize_script传递
$.post(my_ajax_object.ajax_url, data).done(function(response) {
    if(response.includes("INVALID API KEY")){
        return;
    }
    // 仅需一次JSON.parse（因为PHP直接返回了API的JSON响应）
    var json = JSON.parse(response);
    FFLs.list = json;
    FFLs.dict = {};
    $.each(json, function(key,value) {
        FFLs.dict[value.ffl] = value;
    }); 
    
    $("#ffl_select").empty();
    $.each(json, function(_, ffl) {
        var text = `${ffl.licensee}${ffl.dba ? ` (${ffl.dba})` : ''}: ${ffl.premiseAddress}, ${ffl.premiseCity}, ${ffl.premiseState}, ${ffl.premiseZip}`;
        $("#ffl_select").append($("<option>").attr("value", ffl.ffl).text(text));
    });
    
    if($("#ffl_select option[value=\"xxxxxxxx\"]").length){
        $("#ffl_select").val("xxxxxxxx").change();
    } else {
        $("#ffl_select").change();
    }
}).fail(function(xhr, status, error) {
    console.error(xhr.responseText); // 优先在控制台查看详细错误
    alert(`${status} ${error}`);
});

4. 确保ajaxurl正确传递 #

移动端页面可能未自动加载ajaxurl变量，需通过wp_localize_script在前端注入正确路径：

add_action('wp_enqueue_scripts', 'enqueue_plugin_scripts');
function enqueue_plugin_scripts() {
    wp_enqueue_script(
        'ffl-search-script',
        plugin_dir_url(__FILE__) . '/js/your-script.js',
        array('jquery'),
        '1.0',
        true
    );
    wp_localize_script('ffl-search-script', 'my_ajax_object', array(
        'ajax_url' => admin_url('admin-ajax.php')
    ));
}

额外排查点 #

• 检查安全插件（如Wordfence）是否拦截移动端请求，查看插件日志或临时关闭测试；
• 验证移动端输入的邮编是否包含特殊字符（如空格），确保前端已做trim处理；
• 用浏览器开发者工具（移动端模式）查看请求头和参数，确认数据是否正确传递到后端。

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