Question

我正在AngularJS中编写我的第一个SPA，但遇到了路由问题。

我正在尝试启用HTML 5，如下所示：

.config(function ($routeProvider, $locationProvider) {
    $locationProvider.html5Mode(true);

    $routeProvider.otherwise({
        templateUrl: "/angular/components/booking-system/booking-system-template.html"
    });
})

但我知道有一些配置要对服务器（IIS）进行。任何人都能指出我需要做什么的指示方向吗？关于这个主题的各种stackoverflow帖子有点不清楚。

谢谢，M

Answer 1

我认为您不需要配置服务器以使HTML5模式正常工作。您唯一需要做的就是添加

<base href="/">

到<head></head>。

请注意，此配置仅适用于您正在运行的应用位于服务器的根目录（例如＆＃39; http://myapp.com/＆＃39;）。

如果您希望自己的应用在子上下文中运行，例如＆＃39; http://myapp.com/subapp＆＃39;，您需要指定基本href如下：<base href="/subapp">

我希望这能解决你的问题。

卢卡斯

Answer 2

如果您希望启用html5mode，则需要在服务器端进行更改以返回任何URL请求的入口点。然后angular app将解析URL并加载所需的页面。

对此有所了解以供参考： 如何：配置服务器以使用html5Mode https://github.com/angular-ui/ui-router/wiki/Frequently-Asked-Questions#how-to-configure-your-server-to-work-with-html5mode

Answer 3

如果您使用ng-view，则只需在IIS中使用一条规则即可实现此功能。

首先，您需要IIS Url Rewrite Module。

然后，您需要设置一个规则，将所有路径重定向回入口点，以便角度正确地拾取它。

在重写规则中你想要的东西如下：

enter image description here

您也可以使用以下方式直接编辑web.config：

<rule name="Angular Rewrite" enabled="true" stopProcessing="true">
    <match url=".*" />
    <conditions>
        <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
        <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
    </conditions>
    <action type="Rewrite" url="/" />
</rule>

您还需要确保在base

中设置html标记

<base href="/">

在Angular中启用HTML 5模式

3 个答案: