Question

我开始研究一个新的SPA项目并决定使用Angular 4.另外，我有一个用 Asp.Net 5 编写的现有后端并使用 Web.Api 来获取数据。（没有MVC控制器，cshtml等，后端仅用于获取数据！）

我在* .csproj附近创建了新的Angular项目，并放置了Web.config文件（所以这是我网站的根目录。）

问题是 - Angular将所有文件编译为＆＃34; dist＆＃34;文件夹，包括index.html但是IIS无法找到它，因为它的根文件夹高一级。

我尝试了什么：

设置/dist/*route_path*，然后Angular路由器导航到 *route_path*代替pandas
将IIS defaultDocument设置为＆＃34; /dist/index.html" ，但是所有捆绑都没有找到了（404），因为它试图在index.html附近找到它们
弹出Angular webpack配置并对其进行编辑以达到我的目标。我变了＆＃34;的index.html＆＃34;到＆＃34; ../ Index.html＆＃34;我和html一起工作捆绑包，* .css文件中的位URL无效..我无法将它们全部加上前缀与＆＃34; / dist /＆＃34;

有人可以帮我解决这个问题吗？

Answer 1

如果有人感兴趣，我最终使用IIS URL重写模块，如下所示：

<system.webServer>
    <rewrite>
      <rules>
        <rule name="site">
          <match url="(.*)" />
          <conditions logicalGrouping="MatchAll">
            <add input="{REQUEST_URI}" pattern="^/api" negate="true" />
            <add matchType="IsFile" pattern="^/images/" negate="true" />
            <!-- the rest of your rules here... -->
          </conditions>
          <action type="Rewrite" url="/dist/{R:1}" />
        </rule>
      </rules>
    </rewrite>
</system.webServer>

Answer 2

您可以将两个项目都放在一个根域中。通常对于SEO很重要。 angular-cli应用程序和webapi都将位于同一根文件夹中，并且URL重写将类似这样

<rule name="Angular Routes" stopProcessing="true">
      <match url="(.*)" />
      <conditions logicalGrouping="MatchAll">
        <add input="{REQUEST_URI}" pattern="^/api" negate="true" />
        <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
        <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
     </conditions>
   <action type="Rewrite" url="./index.html" />
</rule>

Asp.net 5 Web.Api + IIS + index.html + Angular 4

2 个答案: