Question

关于此问题，有很多问题。我已经阅读了很多，其中大部分都指向配置IIS重写的示例web.config文件。我的问题最近的帖子似乎是这样的：

Angular 2 application not working when moved into IIS virtual directory

然而，这已被投票两次并且似乎已经死了，所以我没有试图复活它，我想我会在这里解释我的问题。

代码作为ASP.NET应用程序托管在：http://127.0.0.1/angular-app/

Angular代码是通过以下命令构建的：ng build --base-href ./，生成的/dist/文件夹是上面本地地址托管的代码。

IIS应用程序具有以下web.config文件：

<?xml version="1.0"?>
<configuration>
    <system.web>
      <compilation debug="true" targetFramework="4.5.2" />
      <httpRuntime targetFramework="4.5.2" />
    </system.web>
    <system.webServer>
        <rewrite>
        <rules>
            <rule name="AngularJS Routes" stopProcessing="true">
            <match url=".*" />
            <conditions logicalGrouping="MatchAll">
                <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
                <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
                <add input="{REQUEST_URI}" pattern="^/(api)" negate="true" />
            </conditions>
            <action type="Rewrite" url="./" />
            </rule>
        </rules>
        </rewrite>
    </system.webServer>
</configuration>

通过此设置，这些URL将返回预期的内容：

http://127.0.0.1/angular-app/

http://127.0.0.1/angular-app/dashboard/

http://127.0.0.1/angular-app/heros/

URL重写规则正确指向应用程序基目录，因此找到vendor.js, main.js等文件。

但是，如果URI越长，重写规则似乎只会查找链接文件的文件夹路径的一步。例如URL

http://127.0.0.1/angular-app/heros/20/

将正确返回index.html并显示“app-loading”

然而，挖掘得更深一点似乎是尝试从基础目录http://127.0.0.1/angular-app/heros/加载vendor.js, main.js等文件，只是向上一步而不是直接从路径开始。

然后，这些链接也被重定向回index.html文件，因此没有任何脚本被传送到浏览器。

我尝试过使用

<base href="/">

而不是./并相应地修改重写规则，但这样做总能将内容重定向到http://127.0.0.1/

正如链接帖子中所建议的，我将基本href更改为：

<base href="/angular-app/">

这会从正确的位置返回index.html。但是，仍然从服务器根目录（http://127.0.0.1/）

请求vendor.js, main.js等文件

我假设我可以通过简单地手动编辑index.html文件以指向来自根的正确路径来解决这个问题，但这看起来像是一个黑客而不是修复。

任何人都可以解释这里发生的事情，为什么：

<base href="/">

为大多数人而不是我工作？

Answer 1

我的解决方案，

利用.aspx页面的强大功能停止使用相对路径。这样一切都可以硬编码

我在/ src /文件夹中创建了一个新的default.aspx页面，并从/dist/index.html复制了生成的代码

然后将此代码调整为此，

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="src_Default" %>

<!doctype html>
<html>
<head>
  <meta charset="utf-8">
  <title>angular-app</title>
  <base href="<%=ResolveUrl("~/")%>">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="icon" type="image/x-icon" href="<%=ResolveUrl("~/favicon.ico")%>" >
</head>
<body>
  <app-root>Loading...</app-root>
  <script type="text/javascript" src="<%=ResolveUrl("~/inline.bundle.js")%>"></script>
  <script type="text/javascript" src="<%=ResolveUrl("~/polyfills.bundle.js")%>"></script>
  <script type="text/javascript" src="<%=ResolveUrl("~/styles.bundle.js")%>"></script>
  <script type="text/javascript" src="<%=ResolveUrl("~/vendor.bundle.js")%>"></script>
  <script type="text/javascript" src="<%=ResolveUrl("~/main.bundle.js")%>"></script></body>
</html>

基本上解析服务器上的asp.net应用程序的bae并将其写入所有引用 - 包括<base href="" />

然后更改.angular-cli.json文件，以便将Default.aspx和default.aspx.cs文件复制到build

上的/ dist /文件夹中

"assets": [
    "Default.aspx",
    "Default.aspx.cs",
    "web.config",
    "assets",
    "favicon.ico"
  ],

在这个过程中我还发现这是将我的web.config文件复制过来的正确方法，我已经手动完成了 - 这样可以解脱。

经过一些IIS调整，以确保默认文档列表中的default.aspx更高，列出一切正常。

现在似乎是一个解决方案，但我可以看到，如果这些文件得到版本化，这将成为一个问题....但是当我/如果我到达它时，我将穿过那座桥。

角度路由IIS - 重写仅适用于浅路径

1 个答案: