Fetch dictionary data using a custom REST data fetcher

Current version: 22.0

The RestDictionaryServiceConfig type accepts a dataFetcher property. You can use this property to pass a custom data fetcher to your instance of the Dictionary Service. By default, the JSS REST Dictionary service uses axios.


This example assumes you create the files in the root directory of the application and that you have a config.js file in that same directory. Adjust the import statements as necessary to reflect your project's setup.

To use a REST dictionary service with a custom data fetcher:

  1. In a dictionary-service.ts file, create an instance of the RestDictionaryService class and provide the configuration object:

    import { AxiosResponse } from 'axios';
    import { 
    } from '@sitecore-jss/sitecore-jss';
    import config from './config';
    // define your custom data fetcher
    function dataFetcher(url: string, data?: unknown): Promise<AxiosResponse<DictionaryServiceData>> {
      return new AxiosDataFetcher().fetch(url, data);
    export const dictionaryService = new RestDictionaryService({
      apiHost: config.sitecoreApiHost,
      apiKey: config.sitecoreApiKey,
      siteName: config.jssAppName,
      // provide your custom data fetcher to the service instance
  2. Import and use the new dictionary service:

    import { dictionaryService } from './dictionary-service';
    const language = 'en';
    dictionaryService.fetchDictionaryData(language).then(data => {
         // do something with the data

Do you have some feedback for us?

If you have suggestions for improving this article,