diff --git a/aio/content/guide/i18n.md b/aio/content/guide/i18n.md index 95aa0e9553..2a9e686761 100644 --- a/aio/content/guide/i18n.md +++ b/aio/content/guide/i18n.md @@ -774,8 +774,83 @@ The HTML `base` tag with the `href` attribute specifies the base URI, or URL, fo You can also use the CLI `--baseHref` option with [`ng build`](cli/build "CLI reference for ng build") to declare the base `href` at compile time. -Configuring servers for hosting multiple locales is outside the scope of this guide. -For details on how to deploy apps to a remote server, see [Deployment](guide/deployment "Deployment guide"). +### Configuring servers + +Typical deployment of multiple languages serve each language from a different subdirectory. +Users are redirected to the preferred language defined in the browser using the +`Accept-Language` HTTP header. If the user has not defined a preferred language, +or if the preferred language is not available, then the server falls back to the default language. +Users can change the language by navigating to other subdirectories, which often occurs using a +menu implemented in the application. + +For more information on how to deploy apps to a remote server, see [Deployment](guide/deployment "Deployment guide"). + +#### Nginx + +The following is an example of an Nginx configuration. + +``` +http { + + # Browser preferred language detection (does NOT require AcceptLanguageModule) + map $http_accept_language $accept_language { + ~*^de de; + ~*^fr fr; + ~*^en en; + } + # ... +} + +server { + listen 80; + server_name localhost; + root /www/data; + + # Fallback to default language if no preference defined by browser + if ($accept_language ~ "^$") { + set $accept_language "fr"; + } + + # Redirect "/" to Angular app in browser's preferred language + rewrite ^/$ /$accept_language permanent; + + # Everything under the Angular app is always redirected to Angular in the correct language + location ~ ^/(fr|de|en) { + try_files $uri /$1/index.html?$args; + } + # ... +} +``` + +#### Apache + +The following is an example of an Apache configuration. + +``` + + ServerName localhost + DocumentRoot /www/data + + RewriteEngine on + RewriteBase / + RewriteRule ^../index\.html$ - [L] + + RewriteCond %{REQUEST_FILENAME} !-f + RewriteCond %{REQUEST_FILENAME} !-d + RewriteRule (..) $1/index.html [L] + + RewriteCond %{HTTP:Accept-Language} ^de [NC] + RewriteRule ^$ /de/ [R] + + RewriteCond %{HTTP:Accept-Language} ^en [NC] + RewriteRule ^$ /en/ [R] + + RewriteCond %{HTTP:Accept-Language} !^en [NC] + RewriteCond %{HTTP:Accept-Language} !^de [NC] + RewriteRule ^$ /fr/ [R] + + +``` {@a app-pre-translation}