Развертывание нескольких локалей

Если myapp — это каталог, содержащий файлы дистрибутива вашего проекта, вы обычно размещаете разные версии для разных локалей в соответствующих каталогах локалей. Например, французская версия находится в каталоге myapp/fr, а испанская — в myapp/es.

HTML-тег base с атрибутом href определяет базовый URI или URL для относительных ссылок. Если вы установите опцию "localize" в файле конфигурации сборки рабочего пространства angular.json в значение true или передадите массив идентификаторов локалей, CLI скорректирует базовый href для каждой версии приложения. Чтобы скорректировать базовый href для каждой версии приложения, CLI добавляет локаль к настроенному "subPath". Укажите "subPath" для каждой локали в вашем файле конфигурации сборки рабочего пространства angular.json. В следующем примере "subPath" задан как пустая строка.

angular.json

"projects": {
    "angular.io-example": {
      // ...
      "i18n": {
        "sourceLocale": "en-US",
        "locales": {
          "fr": {
            "translation": "src/locale/messages.fr.xlf",
            "subPath": ""
          }
        }
      },
      "architect": {
        // ...
      }
    }
  }
  // ...
}

Настройка сервера

При типичном развертывании нескольких языков каждая языковая версия обслуживается из отдельного подкаталога. Пользователи перенаправляются на предпочитаемый язык, определенный в браузере, с помощью HTTP-заголовка Accept-Language. Если пользователь не определил предпочитаемый язык или если этот язык недоступен, сервер использует язык по умолчанию. Чтобы сменить язык, необходимо перейти в другой подкаталог. Смена подкаталога часто реализуется через меню в приложении.

Для получения дополнительной информации о развертывании приложений на удаленном сервере см. раздел Развертывание.

ВАЖНО: Если вы используете Рендеринг на стороне сервера (SSR) с outputMode, установленным в server, Angular автоматически и динамически обрабатывает перенаправление на основе HTTP-заголовка Accept-Language. Это упрощает развертывание, устраняя необходимость в ручной настройке сервера или конфигурации.

Пример для Nginx

В следующем примере показана конфигурация Nginx.

http {
    # Browser preferred language detection (does NOT require
    # AcceptLanguageModule)
    map $http_accept_language $accept_language {
        ~*^de de;
        ~*^fr fr;
        ~*^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 application in the preferred language of the browser
    rewrite ^/$ /$accept_language permanent;

    # Everything under the Angular application is always redirected to Angular in the
    # correct language
    location ~ ^/(fr|de|$) {
        if ($accept_language = "") {
            try_files $uri /index.html?$args;
        }
        try_files $uri /$1/index.html?$args;
    }
    # ...
}

Пример для Apache

В следующем примере показана конфигурация Apache.

# docregion
<VirtualHost *:80>
    ServerName localhost
    DocumentRoot /www/data

    <Directory "/www/data">
        # Enable rewrite engine for URL manipulation
        RewriteEngine on
        RewriteBase /

        # Serve 'index.html' for root-level access
        RewriteRule ^../index\.html$ - [L]

        # If the requested file or directory does not exist, redirect to 'index.html'
        RewriteCond %{REQUEST_FILENAME} !-f
        RewriteCond %{REQUEST_FILENAME} !-d
        RewriteRule (..) $1/index.html [L]

        # Language-based redirection based on HTTP Accept-Language header

        # Redirect German users to the '/de/' directory
        RewriteCond %{HTTP:Accept-Language} ^de [NC]
        RewriteRule ^$ /de/ [R]

        # Redirect English-speaking users to the '/en/' directory
        RewriteCond %{HTTP:Accept-Language} ^en [NC]
        RewriteRule ^$ /en/ [R]

        # Redirect users with unsupported languages (not 'en' or 'de') to the '/fr/' directory
        RewriteCond %{HTTP:Accept-Language} !^en [NC]
        RewriteCond %{HTTP:Accept-Language} !^de [NC]
        RewriteRule ^$ /fr/ [R]
    </Directory>
</VirtualHost>