如何在 Tomcat 服务器中部署 Angular 8 应用程序？答案

【问题标题】：How to deploy Angular 8 app in Tomcat Server?如何在 Tomcat 服务器中部署 Angular 8 应用程序？
【发布时间】：2020-02-01 23:11:18
【问题描述】：

我已经完成了一个关于 Angular 的教程，我想将它部署到我的 tomcat 服务器中。我使用 eclipse 来触发在 localhost:8080 中打开的 tomcat 服务器（我使用/只知道 java 作为后端）。这个 Angular 项目将 Firebase 作为后端，而不是 java。我打算使用java作为后端，因此我需要将它部署在tomcat中。是的，我已经尝试了在堆栈溢出和 YouTube 中找到的所有内容。即，

ng build --prod --aot --base-href=/myapp ，将其放入 webapps/myapp/<files-from-angular-dist> 并在 tomcat 中尝试 root/myapp/<files-from-angular-dist>。
base href ="." ， base href ="./" ， base href ="/" ，并放在根目录和 webapps 的 dist 文件夹中，但它不起作用。
不使用 AOT 编译器（IDK 我为什么这样做）。
将它放在我的动态 web 应用程序（一个旧的 java 项目）的 webcontent 文件夹中。

我该怎么办？

Apache Tomcat 版本 - 9.0.22
Eclipse 地区 - 2019 年 6 月
Angular - 8.2.0（来自ng version）

【问题讨论】：

如果你不需要 SSR 你只需要一个 tomcat 服务器来为每个未知的请求发送给用户，比如 localhost:4200/login file index.html。
如果您使用 firebase，您可以更轻松地在 firebase 托管上发送应用程序。在 firebase 托管服务器中设置为 "source": "**", "destination": "/index.html"，这意味着所有未知的源都发送 index.html 文件。
我对 Angular 中的 SSR 一无所知。另外，如何将包括 404 在内的所有未知请求重定向到 index.html
我不打算使用 firebase 作为后端。我打算用java开发自己的后端。
我也不知道如何将未知查询重定向到 tomcat 服务器中的index.html 文件。 Firebase 托管并不是真正的后端，它只是管理向用户提供必要文件的请求。我不知道您是否知道 Angular 单页应用程序是您将所有文件发送给用户，而他的浏览器就像后端一样工作。这就是为什么您可以将 Angular 应用程序发送到 Firebase 托管并设置应用程序以将 http 查询发送到您的后端服务器以解决业务逻辑，如果您不想将其显示给用户。您的后端将像 REST 服务或宏/微服务一样工作。

标签： java angular tomcat

【解决方案1】：

要在 Tomcat 中部署 Angular 8 应用程序，只需执行以下命令：

ng build --base-href=/应用名称

ng 调用角度
build 要求 Angular 构建当前应用程序
--base-href" 告诉 Angular 创建一个参考目录，生成的 index.html 文件将放置在其中。因此，在当前情况下，生成的文件需要放在 /webapps/app-在 tomcat 目录结构中命名文件夹。

请注意，当命令成功运行时，它会在 project-folder/dist 文件夹中创建所有需要的文件。

此外，当您复制文件（或在本例中为文件夹）时，请确保重新启动 tomcat。

【讨论】：

【解决方案2】：

这是一个典型的使用Angular作为前端，java作为后端的项目案例。我可以建议您使用 Angular 应用程序作为前端应用程序，它可以与 Java 后端作为微服务进行交互。这意味着您可以从 Angular 应用程序对基于 java 的微服务进行休息调用。您可以使用类似npm install 后跟npm start 的命令运行Angular 应用程序，前提是您应该在系统中安装了Node JS。最好使用 yarn 命令，它比 npm 更好。你不需要将基于 angular 的应用程序部署到 Tomcat 中，你可以开发一个基于 java 的微服务，你可以将它部署到 Tomcat 中。我建议使用 Spring Boot 创建一个微服务，您可以直接运行而无需将 Tomcat 作为单独的服务器。 Spring Boot 提供了内置的嵌入式 Tomcat 容器。如果你想将 Angular 和 Spring Boot 结合起来，你可以查看这个链接。 https://dzone.com/articles/java-8-springboot-angularjs-bootstrap-springdata-j

【讨论】：

【解决方案3】：

除了@Dino...

作为替代方案，您可以在架构师>构建下的 angular.json 中配置 href：
```
 "scripts": [],
 "baseHref": "/app-name/",
 "deployUrl": "/app-name/"
```
重要的是修复“deep linking issue”。官方 Angular 文档中也提到过：Server configuration

所以取消注释（或添加）到 tomcat/conf/server.xml

<Valve className="org.apache.catalina.valves.rewrite.RewriteValve" />

并使用内容创建文件 tomcat/conf/Catalina/localhost/rewrite.config

    RewriteCond %{REQUEST_PATH} !-f
    RewriteRule ^/app-one/(.*) /app-one/index.html [L]

    RewriteCond %{REQUEST_PATH} !-f
    RewriteRule ^/app-two/(.*) /app-two/index.html [L]

【讨论】：