Core backend class that implements the i18next BackendModule interface for loading and saving translation resources via HTTP. The backend automatically handles resource loading, error handling, retries, and integration with i18next's lifecycle.
Main class that implements the i18next backend interface.
/**
* HTTP backend implementation for i18next
* Implements BackendModule interface for loading translations via HTTP
*/
export default class HttpBackend implements BackendModule<HttpBackendOptions> {
static type: "backend";
type: "backend";
services: any;
options: HttpBackendOptions;
constructor(services?: any, options?: HttpBackendOptions, allOptions?: any);
init(services?: any, options?: HttpBackendOptions, allOptions?: any): void;
read(language: string, namespace: string, callback: ReadCallback): void;
readMulti?(languages: string[], namespaces: string[], callback: MultiReadCallback): void;
loadUrl(url: string, callback: ReadCallback, languages?: string | string[], namespaces?: string | string[]): void;
create?(languages: string[], namespace: string, key: string, fallbackValue: string, callback?: Function): void;
reload(): void;
}Creates a new HTTP backend instance.
/**
* Creates a new HTTP backend instance
* @param services - i18next services object (interpolator, etc.)
* @param options - Backend configuration options
* @param allOptions - Complete i18next configuration object
*/
constructor(services?: any, options?: HttpBackendOptions, allOptions?: any);Usage Examples:
import HttpBackend from "i18next-http-backend";
// Direct instantiation
const backend = new HttpBackend(null, {
loadPath: '/api/translations/{{lng}}/{{ns}}'
});
// With i18next integration (recommended)
import i18next from "i18next";
i18next.use(HttpBackend).init({
backend: {
loadPath: '/api/translations/{{lng}}/{{ns}}'
}
});Initializes the backend with services and options.
/**
* Initialize backend with services and options
* Sets up default configuration and auto-reload timer if configured
* @param services - i18next services object
* @param options - Backend configuration options
* @param allOptions - Complete i18next configuration object
*/
init(services?: any, options?: HttpBackendOptions, allOptions?: any): void;Loads translation data for a single language and namespace.
/**
* Load translation data for single language/namespace
* @param language - Language code (e.g., 'en', 'de', 'fr')
* @param namespace - Namespace identifier (e.g., 'common', 'navigation')
* @param callback - Callback function called with (error, data)
*/
read(language: string, namespace: string, callback: ReadCallback): void;
type ReadCallback = (error: any, data?: any) => void;Usage Examples:
// Direct backend usage
backend.read('en', 'common', (err, data) => {
if (err) {
console.error('Failed to load translations:', err);
} else {
console.log('Loaded translations:', data);
}
});Loads translation data for multiple languages and namespaces simultaneously.
/**
* Load translation data for multiple languages/namespaces
* Useful with i18next-multiload-backend-adapter for bulk loading
* @param languages - Array of language codes
* @param namespaces - Array of namespace identifiers
* @param callback - Callback function called with (error, data)
*/
readMulti?(languages: string[], namespaces: string[], callback: MultiReadCallback): void;
type MultiReadCallback = (error: any, data?: any) => void;Loads translation data from a specific URL with full control over the request.
/**
* Load translation data from specific URL
* @param url - Complete URL to load from
* @param callback - Callback function for result
* @param languages - Language context for parsing (optional)
* @param namespaces - Namespace context for parsing (optional)
*/
loadUrl(url: string, callback: ReadCallback, languages?: string | string[], namespaces?: string | string[]): void;Usage Examples:
// Load from custom URL
backend.loadUrl('https://api.example.com/translations/en/common', (err, data) => {
if (err) {
console.error('Load failed:', err);
} else {
console.log('Loaded data:', data);
}
});Saves missing translation keys to the backend server (requires saveMissing: true in i18next config).
/**
* Create/save missing translation keys to backend
* Only works when i18next is initialized with { saveMissing: true }
* @param languages - Array of target languages
* @param namespace - Target namespace
* @param key - Translation key to save
* @param fallbackValue - Default value for missing key
* @param callback - Optional completion callback (receives dataArray, resArray)
*/
create?(languages: string[], namespace: string, key: string, fallbackValue: string, callback?: (dataArray: any[], resArray: any[]) => void): void;Usage Examples:
// Save missing key (called automatically by i18next when saveMissing: true)
backend.create(['en', 'de'], 'common', 'new.key', 'Default value', (dataArray, resArray) => {
console.log('Save results:', dataArray, resArray);
});Reloads all translation resources from the backend.
/**
* Reload all translation resources from backend
* Useful for live reloading in development or periodic updates
*/
reload(): void;The backend handles several types of errors automatically:
Error messages follow the pattern:
"failed loading {url}; status code: {status}""failed parsing {url} to json"