{"action":"created","issue":{"url":"https://api.github.com/repos/i18next/react-i18next/issues/471","repository_url":"https://api.github.com/repos/i18next/react-i18next","labels_url":"https://api.github.com/repos/i18next/react-i18next/issues/471/labels{/name}","comments_url":"https://api.github.com/repos/i18next/react-i18next/issues/471/comments","events_url":"https://api.github.com/repos/i18next/react-i18next/issues/471/events","html_url":"https://github.com/i18next/react-i18next/issues/471","id":339216097,"node_id":"MDU6SXNzdWUzMzkyMTYwOTc=","number":471,"title":"react-i18next: How to sync Browser and Express LanguageDetector?","user":{"login":"acmoune","id":8550711,"node_id":"MDQ6VXNlcjg1NTA3MTE=","avatar_url":"https://avatars2.githubusercontent.com/u/8550711?v=4","gravatar_id":"","url":"https://api.github.com/users/acmoune","html_url":"https://github.com/acmoune","followers_url":"https://api.github.com/users/acmoune/followers","following_url":"https://api.github.com/users/acmoune/following{/other_user}","gists_url":"https://api.github.com/users/acmoune/gists{/gist_id}","starred_url":"https://api.github.com/users/acmoune/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/acmoune/subscriptions","organizations_url":"https://api.github.com/users/acmoune/orgs","repos_url":"https://api.github.com/users/acmoune/repos","events_url":"https://api.github.com/users/acmoune/events{/privacy}","received_events_url":"https://api.github.com/users/acmoune/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":0,"created_at":"2018-07-08T10:51:02Z","updated_at":"2018-07-08T13:29:31Z","closed_at":null,"author_association":"NONE","body":"In my server's routes, I do something like this (Note: The` i18next-express-middleware` is already in the pipeline, and Server Side Rendering is working good):\r\n\r\n```javascript\r\nexport default function (req, res) {\r\n  const lng = req.language.toUpperCase()\r\n\r\n  console.log(lng) // Always display [EN]\r\n\r\n  MyModel\r\n    .findOne(query, { fieldEN: 1, fieldFR: 1 })\r\n    .exec()\r\n    .then(res => reply(res[`field${lng}`]))\r\n    .catch(err => handle(err))\r\n}\r\n```\r\nSo I try to return the right version of the field, base on the USER's selected language.\r\n\r\nBut no matter what language is selected on the browser side, on the server side it is always set to the default, EN.\r\n\r\nIs there a way to let the server side LanguageDetector know about the current language on the browser side ?\r\n\r\nThis is my `Client i18n init`:\r\n\r\n```javascript\r\nimport i18n from 'i18next'\r\nimport Backend from 'i18next-xhr-backend'\r\nimport LanguageDetector from 'i18next-browser-languagedetector'\r\n\r\ni18n\r\n  .use(Backend)\r\n  .use(LanguageDetector)\r\n  .init({\r\n    whitelist: ['en', 'fr'],\r\n    fallbackLng: 'en',\r\n    preload: ['en', 'fr'],\r\n\r\n    // debug: true,\r\n\r\n    interpolation: {\r\n      escapeValue: false\r\n    },\r\n\r\n    ns: ['home', 'channel', 'common'],\r\n    defaultNS: 'home',\r\n\r\n    backend: {\r\n      loadPath: '/locales/{{lng}}/{{ns}}.json'\r\n    },\r\n\r\n    react: {\r\n      wait: true,\r\n      bindI18n: 'languageChanged loaded',\r\n      bindStore: 'added removed',\r\n      nsMode: 'default'\r\n    }\r\n  })\r\n\r\nexport default i18n\r\n```\r\n\r\nAnd this is my server` i18n init`:\r\n\r\n```javascript\r\nimport i18n from 'i18next'\r\nimport Backend from 'i18next-node-fs-backend'\r\nimport { LanguageDetector } from 'i18next-express-middleware'\r\n\r\ni18n\r\n  .use(Backend)\r\n  .use(LanguageDetector)\r\n  .init({\r\n    whitelist: ['en', 'fr'],\r\n    fallbackLng: 'en',\r\n    preload: ['en', 'fr'],\r\n\r\n    // debug: true,\r\n\r\n    interpolation: {\r\n      escapeValue: false\r\n    },\r\n\r\n    ns: ['home', 'channel', 'common'],\r\n    defaultNS: 'home',\r\n\r\n    backend: {\r\n      loadPath: `${__dirname}/public/locales/{{lng}}/{{ns}}.json`,\r\n      jsonIndent: 2\r\n    }\r\n  })\r\n\r\nexport default i18n\r\n```"},"comment":{"url":"https://api.github.com/repos/i18next/react-i18next/issues/comments/403287907","html_url":"https://github.com/i18next/react-i18next/issues/471#issuecomment-403287907","issue_url":"https://api.github.com/repos/i18next/react-i18next/issues/471","id":403287907,"node_id":"MDEyOklzc3VlQ29tbWVudDQwMzI4NzkwNw==","user":{"login":"jamuhl","id":977772,"node_id":"MDQ6VXNlcjk3Nzc3Mg==","avatar_url":"https://avatars3.githubusercontent.com/u/977772?v=4","gravatar_id":"","url":"https://api.github.com/users/jamuhl","html_url":"https://github.com/jamuhl","followers_url":"https://api.github.com/users/jamuhl/followers","following_url":"https://api.github.com/users/jamuhl/following{/other_user}","gists_url":"https://api.github.com/users/jamuhl/gists{/gist_id}","starred_url":"https://api.github.com/users/jamuhl/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/jamuhl/subscriptions","organizations_url":"https://api.github.com/users/jamuhl/orgs","repos_url":"https://api.github.com/users/jamuhl/repos","events_url":"https://api.github.com/users/jamuhl/events{/privacy}","received_events_url":"https://api.github.com/users/jamuhl/received_events","type":"User","site_admin":false},"created_at":"2018-07-08T13:29:31Z","updated_at":"2018-07-08T13:29:31Z","author_association":"MEMBER","body":"hm, is your detected language something like `fr-FR`?!? a language-Region combination if so that would not go through the whitelist -> you will need to additional set `nonExplicitWhitelist` on init - https://www.i18next.com/overview/configuration-options#languages-namespaces-resources\r\n\r\njust guessing as everything else looks right..."}}
{"actor":{"display_login":"jamuhl"}}