I'm working on my first wordpress custom theme and working on a custom Gutenberg block. So far it works on my setup. But worried about when users will be installing it on different paths. I'm making a REST API call like this:
function( props ) {
if (! props.attributes.categories ){
wp.apiFetch( {
url: '/wordpress/wp-json/wp/v2/categories'
} ).then(categories => {
props.setAttributes ({
categories: categories
})
});
}
I've installed wordpress locally with MAMP on a custom path (/wordpress) instead of the main folder. So http://localhost/wordpress/ . My question is, the API URL url: '/wordpress/wp-json/wp/v2/categories' works because I've specified the exact path, adding /wordpress/ in front of the usual path, but how can I make it dynamic so that it works for whatever path users install their wordpress site to?
Doing just url: '/wp-json/wp/v2/categories' will work fine for any user as long as wordpress is installed on the index folder. But what if a user decides to install my theme&plugin on a wordpress site under a custom path e.g theme.com/wordpress-subfolder/ ?
Thanks in advance to everyone!
Localize your script with the value of get_rest_url().
wp_register_script( 'my-script' , 'path/to/the-script.js' );
wp_localize_script( 'my_script' , 'wpRestApi' , array( 'url' => get_rest_url() ) );
wp_enqueue_script( 'my_script' );
In the js, you can access the url with wpRestApi.url
wpRestApi.url + 'wp/v2/categories'