我很困惑如何将api连接到wordpress模板（2）

Question

我正在使用 WordPress 构建一个网站，并希望显示从使用 Express.js 开发的 API 获取的数据。我已经编写了代码来使用 Express.js API 从数据库中获取数据并通过 WordPress REST API 显示它，但数据没有出现在网站上。

以下是我的设置的详细信息：

Express.js API 正在 http://localhost:3456/api/items:

上运行

GET /api/items 端点返回项目列表。 POST /api/items 端点添加新项目。 WordPress REST API 用于从 Express.js 获取数据并将其显示在主题中。

WordPress 中使用的代码：

// Add WordPress REST API to connect with Express.js API
add_action('rest_api_init', function () {
    register_rest_route('vehica/v1', '/items', [
        'methods' => 'GET',
        'callback' => 'vehica_get_items',
        'permission_callback' => '__return_true',
    ]);
});

function vehica_get_items(WP_REST_Request $request) {
    $api_url = 'http://localhost:3456/api/items';
    $response = wp_remote_get($api_url);

    if (is_wp_error($response)) {
        return new WP_Error('api_error', 'Failed to fetch items from API', ['status' => 500]);
    }

    $body = wp_remote_retrieve_body($response);
    return rest_ensure_response(json_decode($body, true));
}

问题：

从 API 获取的数据未显示在网站上，尽管我尝试使用 PHP 和 JavaScript 获取数据。 浏览器控制台或日志中没有出现明确的错误消息。 我采取的步骤：

使用 Postman 验证 API 是否正常工作。 检查是否通过 REST API 调用 vehica_get_items，网址为 http://example.com/wp-json/vehica/v1/items。 在 Express.js API 中添加了 CORS 标头，以确保允许请求。 检查了 WordPress 和 API 服务器错误日志。 问题：

我的设置可能有什么问题？ 如何确保API的数据在网站上正确显示？

找到我遇到的问题的解决方案

Answer 1

要将数据从 API 获取到 WordPress 服务器，再从那里传输到用户的浏览器，您需要在页面中使用 JavaScript 来向您向我们展示的 REST 代码发出 AJAX 或获取请求。您需要执行 GET 请求来

/wp-json/vehica/v1/items

在该 Javascript 中，然后使用该 Javascript 显示返回给用户的数据。您没有在问题中显示该代码。你有吗？

许多实现此类远程 API 访问的人使用自定义的短代码来获取最终用户可见的 API 数据。至少作为让事情发挥作用的原型。

如果需要，您可以添加自定义块以达到与使用 REST api 相同的目的。