All Projects β†’ i18next β†’ I18next Browser Languagedetector

i18next / I18next Browser Languagedetector

Licence: mit
language detector used in browser environment for i18next

Programming Languages

javascript
184084 projects - #8 most used programming language
language
365 projects

Projects that are alternatives of or similar to I18next Browser Languagedetector

Pull To Reload
Pull to reload implementation for the web. Designed to work with both mobile and websites.
Stars: ✭ 396 (-7.48%)
Mutual labels:  plugin
Oc Shopaholic Plugin
πŸ›οΈ #1 e-commerce platform for October CMS
Stars: ✭ 404 (-5.61%)
Mutual labels:  plugin
Vue Stash
Easily share reactive data between your Vue components.
Stars: ✭ 412 (-3.74%)
Mutual labels:  plugin
Ts3audiobot
Advanced Musicbot for Teamspeak 3
Stars: ✭ 397 (-7.24%)
Mutual labels:  plugin
Chartjs Plugin Zoom
Zoom and pan plugin for Chart.js
Stars: ✭ 404 (-5.61%)
Mutual labels:  plugin
Fpn tensorflow
A Tensorflow implementation of FPN detection framework.
Stars: ✭ 407 (-4.91%)
Mutual labels:  detection
Applicationinspector
A source code analyzer built for surfacing features of interest and other characteristics to answer the question 'What's in the code?' quickly using static analysis with a json based rules engine. Ideal for scanning components before use or detecting feature level changes.
Stars: ✭ 3,873 (+804.91%)
Mutual labels:  detection
Dialogic
πŸ’¬ Create dialogs, characters and scenes to display conversations in your Godot games.
Stars: ✭ 414 (-3.27%)
Mutual labels:  plugin
Voxelnet Tensorflow
A 3D object detection system for autonomous driving.
Stars: ✭ 404 (-5.61%)
Mutual labels:  detection
R2cnn fpn tensorflow
R2CNN: Rotational Region CNN Based on FPN (Tensorflow)
Stars: ✭ 412 (-3.74%)
Mutual labels:  detection
Automl
Google Brain AutoML
Stars: ✭ 4,795 (+1020.33%)
Mutual labels:  detection
Klakndi
NewTek NDIβ„’ plugin for Unity
Stars: ✭ 401 (-6.31%)
Mutual labels:  plugin
Elasticsearch Prometheus Exporter
Prometheus exporter plugin for Elasticsearch
Stars: ✭ 409 (-4.44%)
Mutual labels:  plugin
Grassbending
A replacement for Unity's terrain grass shader with alpha blended rendering and touch bending effect
Stars: ✭ 397 (-7.24%)
Mutual labels:  plugin
Ue4voxelterrain
[WIP] Unreal Engine 4: Smooth voxel terrian example
Stars: ✭ 415 (-3.04%)
Mutual labels:  plugin
Pvt
Stars: ✭ 379 (-11.45%)
Mutual labels:  detection
Pytest Html
Plugin for generating HTML reports for pytest results
Stars: ✭ 404 (-5.61%)
Mutual labels:  plugin
Gijgo
Gijgo - Free Javascript Controls
Stars: ✭ 424 (-0.93%)
Mutual labels:  plugin
Beehive
🐝 BeeHive is a solution for iOS Application module programs, it absorbed the Spring Framework API service concept to avoid coupling between modules.
Stars: ✭ 4,117 (+861.92%)
Mutual labels:  plugin
Python Betterproto
Clean, modern, Python 3.6+ code generator & library for Protobuf 3 and async gRPC
Stars: ✭ 412 (-3.74%)
Mutual labels:  plugin

Introduction

npm version Bower David

This is a i18next language detection plugin use to detect user language in the browser with support for:

  • cookie (set cookie i18next=LANGUAGE)
  • sessionStorage (set key i18nextLng=LANGUAGE)
  • localStorage (set key i18nextLng=LANGUAGE)
  • navigator (set browser language)
  • querystring (append ?lng=LANGUAGE to URL)
  • htmlTag (add html language tag <html lang="LANGUAGE" ...)
  • path (http://my.site.com/LANGUAGE/...)
  • subdomain (http://LANGUAGE.site.com/...)

Getting started

Source can be loaded via npm, bower or downloaded from this repo.

# npm package
$ npm install i18next-browser-languagedetector

# bower
$ bower install i18next-browser-languagedetector
  • If you don't use a module loader it will be added to window.i18nextBrowserLanguageDetector

Wiring up:

import i18next from 'i18next';
import LanguageDetector from 'i18next-browser-languagedetector';

i18next.use(LanguageDetector).init(i18nextOptions);

As with all modules you can either pass the constructor function (class) to the i18next.use or a concrete instance.

Detector Options

The default options can be found here.

{
  // order and from where user language should be detected
  order: ['querystring', 'cookie', 'localStorage', 'sessionStorage', 'navigator', 'htmlTag', 'path', 'subdomain'],

  // keys or params to lookup language from
  lookupQuerystring: 'lng',
  lookupCookie: 'i18next',
  lookupLocalStorage: 'i18nextLng',
  lookupSessionStorage: 'i18nextLng',
  lookupFromPathIndex: 0,
  lookupFromSubdomainIndex: 0,

  // cache user language on
  caches: ['localStorage', 'cookie'],
  excludeCacheFor: ['cimode'], // languages to not persist (cookie, localStorage)

  // optional expire and domain for set cookie
  cookieMinutes: 10,
  cookieDomain: 'myDomain',

  // optional htmlTag with lang attribute, the default is:
  htmlTag: document.documentElement,

  // optional set cookie options, reference:[MDN Set-Cookie docs](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Set-Cookie)
  cookieOptions: { path: '/', sameSite: 'strict' }
}

Options can be passed in:

preferred - by setting options.detection in i18next.init:

import i18next from 'i18next';
import LanguageDetector from 'i18next-browser-languagedetector';

i18next.use(LanguageDetector).init({
  detection: options,
});

on construction:

import LanguageDetector from 'i18next-browser-languagedetector';
const languageDetector = new LanguageDetector(null, options);

via calling init:

import LanguageDetector from 'i18next-browser-languagedetector';
const languageDetector = new LanguageDetector();
languageDetector.init(options);

Adding own detection functionality

interface

export default {
  name: 'myDetectorsName',

  lookup(options) {
    // options -> are passed in options
    return 'en';
  },

  cacheUserLanguage(lng, options) {
    // options -> are passed in options
    // lng -> current language, will be called after init and on changeLanguage
    // store it
  },
};

adding it

import LanguageDetector from 'i18next-browser-languagedetector';
const languageDetector = new LanguageDetector();
languageDetector.addDetector(myDetector);

i18next.use(languageDetector).init({
  detection: options,
});

Don't forget: You have to add the name of your detector (myDetectorsName in this case) to the order array in your options object. Without that, your detector won't be used. See the Detector Options section for more.


Gold Sponsors


localization as a service - locize.com

Needing a translation management? Want to edit your translations with an InContext Editor? Use the orginal provided to you by the maintainers of i18next!

locize

With using locize you directly support the future of i18next and react-i18next.


Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].