WordPress站点如何调用PHP cURL实现商品搜索API请求

你原有代码存在几个核心问题导致无法正常运行：

• AJAX传参格式错误：直接传入输入字符串而非键值对，PHP端无法通过$_GET['input']获取搜索词
• 代码结构不符合WordPress规范：PHP逻辑和HTML混写，无法复用WordPress内置的安全校验、路径处理能力，还会导致响应内容混杂页面HTML，前端无法正常解析结果
• 缺少必要的安全处理：未对用户输入做过滤、URL编码，存在注入风险，搜索词包含空格、特殊字符时会直接导致API请求失败
• 变量未初始化：PHP代码中直接使用$input变量但未提前从请求中取值，会触发PHP运行警告

1. 函数与后端逻辑存放位置 #

所有PHP代码统一放到当前启用主题的functions.php文件中，不要直接混写在页面HTML里。
首先放入修正后的cURL封装函数，记得把代码中的API_KEY替换为你申请的真实接口密钥：

<?php
function callAPI($data) {
    // 对搜索关键词做URL编码，避免特殊字符导致请求异常
    $product = urlencode(trim($data));
    $curl = curl_init();

    curl_setopt_array($curl, array(
        CURLOPT_URL => "https://price-api.datayuge.com/api/v1/compare/search?api_key=API_KEY&product=".$product."&page=1",
        CURLOPT_RETURNTRANSFER => true,
        CURLOPT_ENCODING => "",
        CURLOPT_MAXREDIRS => 10,
        CURLOPT_TIMEOUT => 30,
        CURLOPT_HTTP_VERSION => CURL_HTTP_VERSION_1_1,
        CURLOPT_CUSTOMREQUEST => "GET",
        CURLOPT_HTTPHEADER => array(
            "content-type: application/json"
        ),
    ));

    $response = curl_exec($curl);
    $err = curl_error($curl);
    curl_close($curl);

    if ($err) {
        return json_encode(['code' => 500, 'msg' => "cURL Error #:".$err]);
    } else {
        return $response;
    }
}

接着在functions.php中加入AJAX请求处理逻辑，同时把AJAX地址注入到页面头部，避免硬编码路径：

// 挂载登录/未登录用户的搜索请求处理钩子
add_action('wp_ajax_product_price_search', 'handle_product_search');
add_action('wp_ajax_nopriv_product_price_search', 'handle_product_search');
function handle_product_search() {
    // 校验参数合法性
    if (!isset($_GET['keyword']) || empty(trim($_GET['keyword']))) {
        wp_send_json(['code' => 400, 'msg' => '请输入搜索关键词'], 400);
    }
    // 用WordPress内置函数做输入过滤，防注入风险
    $keyword = sanitize_text_field($_GET['keyword']);
    $result = callAPI($keyword);
    // 返回JSON格式结果并终止程序，避免多余页面内容混入响应
    wp_send_json(json_decode($result, true));
    wp_die();
}

// 向页面注入AJAX全局配置
add_action('wp_head', 'inject_ajax_config');
function inject_ajax_config() {
    ?>
    <script>
        const ajaxUrl = "<?php echo admin_url('admin-ajax.php'); ?>";
    </script>
    <?php
}
?>

2. 前端搜索表单代码 #

把下面的代码放到你需要显示搜索框的位置，可以是自定义页面模板、主题搜索栏模板或者文本小工具中：

<div class="product-search-box">
    <p>搜索任意商品</p>
    <input id="userInput" type="text" placeholder="输入商品名称搜索...">
    <button id="searchBtn">提交搜索</button>
    <div id="searchResult" style="margin-top: 15px;"></div>
</div>
<!-- 注：如果主题已经全局加载jQuery，删除下面这行脚本引入即可，避免版本冲突 -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
$('#searchBtn').on('click', function() {
    let input = $.trim($('#userInput').val());
    if (!input) {
        alert('请输入要搜索的商品名称');
        return;
    }
    $.ajax({
        url: ajaxUrl,
        type: "GET",
        data: {
            action: 'product_price_search', // 必须和后端注册的AJAX动作名一致
            keyword: input // 以键值对格式传参，后端才能正常取值
        },
        dataType: 'json',
        success: function(res) {
            console.log(res);
            // 以下为结果渲染示例，可根据接口返回结构自行调整展示样式
            let html = '<ul>';
            if (res.data && res.data.length > 0) {
                res.data.forEach(item => {
                    html += `<li>${item.product_name} - 最低价格：${item.lowest_price}</li>`;
                })
            } else {
                html += '<li>未找到相关商品</li>';
            }
            html += '</ul>';
            $('#searchResult').html(html);
        },
        error: function() {
            alert('搜索请求失败，请稍后重试');
        }
    });
})
</script>

关键注意点 #

• 所有用户输入内容必须做过滤、编码处理，禁止直接拼接到API请求地址或数据库查询语句中
• WordPress AJAX请求必须携带action参数，才能匹配到对应的后端处理函数
• AJAX处理逻辑末尾必须加wp_die()终止程序，否则会自动输出WordPress页脚内容，导致前端JSON解析失败
• 如果需要对接WordPress原生搜索表单，只需要给原生搜索表单加提交事件拦截，把搜索关键词传到上面的接口即可，不需要额外修改表单结构

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