Translations not loaded after migrating from i18next-xhr-backend

[jbanulso]

🐛 Bug Report

Attempting to upgrade from the deprecated i18n-xhr-backend to i18next-http-backend with the same configuration approach means the translations keys are no longer loaded. They are downloaded from the server successfully, but it seems that the json response is not parsed by i18next-http-backend.

To Reproduce

Moving from this config in i18n-xhr-backend:

ajax: async (url, options, callback) => {
  try {
    const response = await customFetch(url);
    const body = await response.text();
    callback(body, response);
  } catch (e) {
    console.info('Error fetching translations', e);
    callback(null, e);
  }
}

to this one in i18n-http-backend:

request: async (options, url, payload, callback) => {
  try {
    const response = await customFetch(url);
    const body = await response.text();
    callback(body, response);
  } catch (e) {
    console.info('Error fetching translations', e);
    callback(null, e);
  }
}

breaks the translations, and results in a bunch of "missing keys" debug messages in the console.

(customFetch is just adding a number of headers and tokens to the fetch request)

Expected behavior

The translations should be displayed in my application.

Your Environment

• Node version: 12.16.1
• i18next version: 19.4.5
• react-i18next version: 11.5.0
• OS: macOS Catalina 10.15.4
• Browser: Chrome 83.0.4103.61

[adrai]

The callback signature is different... example: https://github.com/i18next/i18next-http-backend/blob/master/lib/index.js#L65

[jbanulso]

@adrai Ah I see, my bad. Thank you for the quick response, and for changing the Readme.