无法让 Angular html5mode 和 UrlRewriteFilter 与某些 URL 一起工作答案

【问题标题】：Unable to get Angular html5mode and UrlRewriteFilter working with certain URLs无法让 Angular html5mode 和 UrlRewriteFilter 与某些 URL 一起工作
【发布时间】：2015-02-27 01:28:09
【问题描述】：

我正在使用带有 Java/Jersey REST API 的 AngularJS 1.3 webapp。我终于让 html5mode 与 Tuckey UrlRewriteFilter 一起工作，所以像 localhost:8080/#/page 这样简单的东西现在只是 localhost:8080/page 。但是，我似乎无法让 localhost:8080/mypage/category/subcategory/item 等更复杂的东西正常工作。当在单个浏览器选项卡中时，此 url 将以 html5mode 加载，但如果我在新选项卡中打开链接，我会得到 404。

这是我的 pom 和 web.xml 文件：

pom.xml

<filter>
    <filter-name>UrlRewriteFilter</filter-name>
    <filter-class>org.tuckey.web.filters.urlrewrite.UrlRewriteFilter</filter-class>
    <init-param>
        <param-name>confPath</param-name>
        <param-value>/WEB-INF/urlrewrite.xml</param-value>
    </init-param>
</filter>
<filter-mapping>
    <filter-name>UrlRewriteFilter</filter-name>
    <url-pattern>/*</url-pattern>
    <dispatcher>REQUEST</dispatcher>
    <dispatcher>FORWARD</dispatcher>
</filter-mapping>

web.xml：

<urlrewrite>
    <rule match-type="wildcard">
        <from>*/page</from>
        <to>index.html</to>
    </rule>

    // what should this rule look like in order to recognize a url like:
    // localhost:8080/mypage/category/subcategory/item
    <rule match-type="wildcard">
        <from>?</from>
        <to>index.html</to>
    </rule>
</urlrewrite>

我通读了 UrlRewriteFilter 文档 here 并尝试使用通配符匹配和正则表达式语法的不同变体，但我总是得到 404。

我还要补充一点，我正在使用 angular-ui-router 版本 0.2.13，我的相关页面/状态的 url 看起来像 /mypage/:category/:subcategory/:item。

所以我的问题是如何匹配此模式，以便重定向到 index.html 对 html5mode 正常工作，或者我应该以不同的方式配置路由以更好地使用 UrlRewriteFilter？

【问题讨论】：

标签： angularjs angular-ui-router tuckey-urlrewrite-filter

【解决方案1】：

这是我最终使用的

<urlrewrite>
<rule match-type="regex" enabled="true">
    <condition type="request-filename" operator="notfile" />
    <condition type="request-filename" operator="notdir" />
    <condition type="request-uri" operator="notequal">(\.html|\.js)</condition>
    <from>^/html/(.*rootpage1.*|.*rootpage2.*)$</from>
    <to last="true">/html/index.html</to>
</rule>

因为我的应用正在使用<base href="/myapp/html/">

我还必须将 index.html 上的引用从相对于 href="/myapp/html/otherpage.html" 更改，因为例如。当在 /myapp/html/rootpage1/page1/something 上使用相对引用并且重写将 url 传递给 index.html 时，它位于 rootpage1/ 范围内，而不是 html/ 范围内。

【讨论】：