创新互联Angular教程:Angular 部署多个语言环境

部署多个语言环境

如果 ​myapp ​是包含项目可分发文件的目录,你通常会在语言环境目录中为不同的语言环境提供不同的版本,比如法语版的 ​myapp/fr​ 和西班牙语版的 ​myapp/es​。

创新互联公司是一家集网站建设,铜陵企业网站建设,铜陵品牌网站建设,网站定制,铜陵网站建设报价,网络营销,网络优化,铜陵网站推广为一体的创新建站企业,帮助传统企业提升企业形象加强企业竞争力。可充分满足这一群体相比中小企业更为丰富、高端、多元的互联网需求。同时我们时刻保持专业、时尚、前沿,时刻以成就客户成长自我,坚持不断学习、思考、沉淀、净化自己,让我们为更多的企业打造出实用型网站。

带有 ​href​ 属性的 HTML ​base ​标签指定了相对链接的基本 URI 或 URL。如果你将工作空间构建配置文件 ​Angular.json​ 中的 ​"localize"​ 选项设置为 ​true ​或语言环境 ID 数组,CLI 会为应用程序的每个版本调整 base ​href​。要为应用程序的每个版本调整 base ​href​,CLI 会将语言环境添加到配置的 ​"baseHref"​ 中。在工作区配置文件 ​angular.json​ 中为每个语言环境指定 ​"baseHref"​。以下示例展示了设置为空字符串的 ​"baseHref"​。

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

此外,要在编译时声明 base ​href​,请将在 CLI 中使用带有 ​--baseHref​ 选项的 ​ng build​ 。

配置服务器

多语言的典型部署方式是为来自不同子目录的每种语言提供服务。使用 ​Accept-Language​ HTTP 标头将用户重定向到浏览器中定义的首选语言。如果用户未定义首选语言,或者首选语言不可用,则服务器将回退到默认语言。要更改语言,就转到另一个子目录。 子目录的更改通常使用应用程序中实现的菜单进行。

Nginx 范例

以下示例展示了 Nginx 配置。

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 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|en) {
        try_files $uri /$1/index.html?$args;
    }
    # ...
}

Apache 范例

以下示例展示了 Apache 配置。


    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]
    

网站题目:创新互联Angular教程:Angular 部署多个语言环境
标题网址:http://www.csdahua.cn/qtweb/news2/533902.html

网站建设、网络推广公司-快上网,是专注品牌与效果的网站制作,网络营销seo公司;服务项目有等

广告

声明:本网站发布的内容(图片、视频和文字)以用户投稿、用户转载内容为主,如果涉及侵权请尽快告知,我们将会在第一时间删除。文章观点不代表本网站立场,如需处理请联系客服。电话:028-86922220;邮箱:631063699@qq.com。内容未经允许不得转载,或转载时需注明来源: 快上网