在将Angular2应用程序托管到IIS之后，直接URL无法正常工作。

Question

在将Angular2应用程序托管到IIS之后，直接URL无法正常工作。

angulariis-7.5angular2-routingangular-cli

11

我们开发了Angular2应用程序。

在使用'ng serve'的angular-cli下运行时，它可以正常工作。

一旦我们将应用程序托管到IIS 7.5上，我们可以浏览到应用程序的根目录，并且可以从应用程序导航创建的任何其他视图中导航。

但是当用户尝试加载针对特定路由或组件的URL时，问题就开始了。

因此，如果我们转到http://serverurl ...它会加载index.html，然后单击index.html上的导航链接，它会将用户带到http://serverurl/route1/component1 但是，当用户尝试直接通过在浏览器地址栏中键入http://serverurl/route1/component1来访问http://serverurl/route1/component1时，它会将该请求发送到IIS，然后返回资源未找到的错误。

很容易理解，该url不存在于服务器上，这是angular url。理想情况下，它应该加载index.html并将其余的url传递给angular路由器并加载/route1/component1。这在'ng serve'中可以工作，但在IIS 7.5中无法工作。我需要在IIS中进行任何设置才能使其正常工作吗？或者在Angular2应用程序中需要做一些事情吗？

有人能建议我如何解决这个问题吗？

- microchip78

使用 URL Rewrite 模块编写规则，将某个 URL 下的所有内容重定向到该 URL 的内容。 - Harry Ninh

3个回答

1

对我而言，使用 Angular 4.0 和 IIS 6.1，一个更简单的修改起作用了。这使我能够使用命名站点而不是默认文件夹或上述重写。我只是将基本 href 从 '/' 改为我的应用程序文件夹的名称：

<head>
    <base href="MyApp">
...

希望这对其他人有用！

- Glinkot

0

[Windows托管] 创建文本文件并将其命名为“web.config” 打开它并粘贴下面的内容，然后确保它在您的托管根目录中。

<?xml version="1.0" encoding="utf-8"?>
      <configuration>

      <system.webServer>
        <rewrite>
          <rules>
            <rule name="Angular Routes" stopProcessing="true">
              <match url=".*" />
              <conditions logicalGrouping="MatchAll">
                <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
                <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
              </conditions>
              <action type="Rewrite" url="./index.html" />
            </rule>
          </rules>
        </rewrite>
      </system.webServer>

      </configuration>

祝你好运 :) 当我能为别人节省时间时，这是非常有益的！

- Nour Lababidi

在我的情况下，我不得不使用索引而不是其他解决方案建议的“/”。 <action type="Rewrite" url="./index.html" /> - Nour Lababidi

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- microchip78 · Accepted Answer

我通过以下步骤解决了这个问题：

从https://www.microsoft.com/en-au/download/details.aspx?id=7435下载了URL重写模块。
将以下内容添加到我的web.config文件中：

<configuration>
  <system.webServer>
    <rewrite>
      <rules>
        <rule name="AngularJS" stopProcessing="true">
          <match url=".*" />
          <conditions logicalGrouping="MatchAll">
            <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
            <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
          </conditions>
          <action type="Rewrite" url="/" />
        </rule>
      </rules>
    </rewrite>
  </system.webServer>
</configuration>

在index.html中设置base标签。它应该紧跟在<head>标签之后。

<base href="/"/>

这三步将为您设置在IIS 7.5或IIS 8.0上使用html5mode URL部署Angular2 / Angular应用程序

希望这会有所帮助。我必须浏览一些答案才能解决这个问题。