WordPress REST API如何适配站点自定义安装路径实现动态调用

方案1：使用wp.apiFetch自带的path参数（最推荐） #

wp.apiFetch本身已经内置了站点路径适配逻辑，你不需要手动拼接完整URL，把原来的url参数换成path参数，直接写REST路由的后缀部分就行。修改后的代码如下：

function( props ) {
    if (! props.attributes.categories ){
        wp.apiFetch( {
            // 替换url为path，只写路由后缀部分
            path: '/wp/v2/categories'
        } ).then(categories => {
            props.setAttributes ({
                categories: categories
            })
        });
    }
}

这个方法会自动适配任意站点的安装路径，不管是根目录还是子目录，底层会自动获取站点的REST API根路径拼接，完全不需要你手动处理前缀，同时还会自动携带请求所需的nonce校验参数，不需要额外配置。

方案2：手动读取全局REST API根路径 #

如果你确实需要用到完整url参数，可以直接调用WordPress默认注入前端的全局配置变量wpApiSettings.root，拼接路由后缀即可：

wp.apiFetch( {
    url: wpApiSettings.root + 'wp/v2/categories'
} )

wpApiSettings.root默认已经包含了站点子目录前缀和wp-json/部分，不需要额外补充这部分内容。

兜底方案：服务端注入自定义配置 #

如果你的区块脚本加载时没有默认加载wpApiSettings，可以在服务端注册脚本的时候用wp_localize_script注入站点配置：

// 在主题/插件的脚本入队逻辑中添加
wp_localize_script(
    'your_block_script_handle', // 替换为你自己注册区块脚本的句柄
    'customSiteConfig', // 自定义的前端全局变量名
    array(
        'rest_root' => get_rest_url(),
    )
);

之后前端就可以通过customSiteConfig.rest_root获取REST API根路径，拼接路由使用即可。

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