Question

我在尝试将我的Angular2应用程序部署到tomcat8时面临一个奇怪的问题。

首先是上下文： - 我使用Angular Cli来协助我的构建过程。 - 应用程序在本地完美运行：ng服务 - ng build使我的dist / dir与所有prod资源 - 我创建了一个gulp任务来创建一个WAR，以便将应用程序正确部署到Tomcat。 - 战争部署到tomcat webapps directoy

我的应用URI就是这样：https：\ www.myexample.com \ myapp \

Home uri工作正常; 尝试使用Angular2路由时问题开始了;例如 HTTPS：\ www.myexample.com \ MYAPP \ myroute

Tomcats认为它是一个新的webapp目录并且没有进行任何转发做https：\ www.myexample.com \ myapp \ index.html

我见过几篇关于这种行为的帖子，但到目前为止;我还没有看到任何解决方案。

有没有人知道如何克服这个问题才能在tomcat8上正确运行我的angular2应用程序？

感谢您的支持。

Answer 1

除非dir或文件存在，否则您需要重写要提供index.html的网址。

配置Tomcat以使用重写阀https://tomcat.apache.org/tomcat-8.0-doc/rewrite.html

然后将以下内容添加到rewrite.config文件中：

# If dir or asset exists go to it
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -f [OR]
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -d
RewriteRule ^ - [L]
# Rewrite all other urls to use index.html
RewriteRule ^ /index.html

Answer 2

使用适用于每个服务器的RouterModule.forRoot(useHash: true)将#切换到网址。

要使用HTML5 pushState（Angular默认值），您的服务器需要配置为支持它。

有关两种风格的比较，请参阅https://angular.io/docs/ts/latest/guide/router.html#!#browser-url-styles

Answer 3

Angular（2+）支持两种类型的路由策略-HashLocationStrategy和PathLocationStrategy。使用角度CLI生成应用程序时，PathLocationStrategy是默认配置。 PathLocationStrategy比HashLocationStrategy具有很多优势，并且是文档here中讨论的推荐配置。

PathLocationStrategy的缺点是它需要在服务器端进行特定的配置。如果未在服务器端完成此配置，则在直接访问深层链接时将导致404。另外，此配置取决于所使用的服务器。

用于解决在Apache Tomcat服务器（8，9）上部署角度应用程序（使用PathLocationStrategy路由）时的深层链接问题-

在server.xml中配置RewriteValve
在rewrite.config中写入重写规则

server.xml-

...
      <Host name="localhost"  appBase="webapps"
            unpackWARs="true" autoDeploy="true">

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

...
      </Host>
...

rewrite.config-（注意-/ hello /是tomcat上的角度应用程序的上下文路径）

RewriteCond %{REQUEST_PATH} !-f
RewriteRule ^/hello/(.*) /hello/index.html

我已在我的文章-Fixing deep linking issue – Deploying angular application on Tomcat server

中记录了此问题

将Angular2应用程序部署到Tomcat8 - 路由似乎不起作用

3 个答案: