@wordpress/api-fetch

API Fetch

Utility to make WordPress REST API requests. It's a wrapper around window.fetch.

Installation

Install the module

npm install @wordpress/api-fetch --save

This package assumes that your code will run in an ES2015+ environment. If you're using an environment that has limited or no support for ES2015+ such as lower versions of IE then using core-js or @babel/polyfill will add support for these methods. Learn more about it in Babel docs.

Usage

import apiFetch from '@wordpress/api-fetch';

apiFetch( { path: '/wp-json/wp/v2/posts' } ).then( posts => {
	console.log( posts );
} );

Middlewares

the api-fetch package supports middlewares. Middlewares are functions you can use to wrap the apiFetch calls to perform any pre/post process to the API requests.

Example

import apiFetch from '@wordpress/api-fetch';

apiFetch.use( ( options, next ) => {
	const start = Date.now();
	const result = next( options );
	result.then( () => {
		console.log( 'The request took ' + Date.now() - start );
	} );
	return result;
} );

Built-in middlewares

The api-fetch package provides built-in middlewares you can use to provide a nonce and a custom rootURL.

Nonce middleware

import apiFetch from '@wordpress/api-fetch';

const nonce = "nonce value";
apiFetch.use( apiFetch.createNonceMiddleware( nonce ) );

Root URL middleware

import apiFetch from '@wordpress/api-fetch';

const rootURL = "http://my-wordpress-site/wp-json/";
apiFetch.use( apiFetch.createRootURLMiddleware( rootURL ) );