javascript - IIS Rewrite 在刷新时丢失 Angular 应用程序中的路径

Question

所以我一直在为我的 Angular.js 应用程序和 IIS 重写而苦苦挣扎。我的网站位于 http://server/jwb/文件夹。我让它重写到/jwb/中的 index.html 文件，并且我有一个 index.html 的内部。问题是当我导航到 http://server/jwb/parties/12345 时，通过 Angular 完成时看起来很好，但是当我在浏览器上点击刷新时，我丢失了 CSS 和 javascript。我查看控制台，它们被重写为 http://server/jwb/parties/js/nameoffile.js等。我想做的是告诉 IIS 重写以始终查看它们真正所在的 js、css 和 img 文件，它们位于 http://server/jwb/js。 , http://server/jwb/css和 http://server/jwb/img等

为我完成此任务的重写规则是什么？有没有比使用重写规则更好的方法？

我目前在我的 web.config 中有这个:

<rules>
    <rule name="Imported Rule 1" stopProcessing="true">
        <match url="^index\.html" ignoreCase="false" />
        <action type="None" />
    </rule>
    <rule name="Imported Rule 2" stopProcessing="true">
        <match url="." ignoreCase="false" />
        <conditions>
            <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>

但是，这仍然会做一些奇怪的事情。我什至用相对路径做了一些测试，这是我发现的:

我们现在已经测试了以下引用文件的方法:

<link rel="stylesheet" href="css/bootstrap.css" />

或

<link rel="stylesheet" href="/css/bootstrap.css" />

或

<link rel="stylesheet" href="./css/bootstrap.css" />

或

<link rel="stylesheet" href="../css/bootstrap.css" />

而且它们都不起作用。下面显示了当我们使用每个文件作为应用程序路径的引用时会发生什么。为了便于论证，我们的路径如下:

index --> http://10.34.34.46/jbvdev/calendar
documents --> http://10.34.34.46/jbvdev/documents/BC498484
caseNotes --> http://10.34.34.46/jbvdev/casenotes/CV/LA%20/2081/BC498484

Answer 1

我遇到了完全相同的问题...并且在完成所有添加基础引用和其他地方建议的内容之后仍然存在完全相同的问题。

所以是的，请在您的 index.html 或作为您的 Angular 应用程序基础的任何页面中添加一个基础引用“/”。然后你需要恢复到良好的正则表达式......

我玩了一会儿，以便在正确的位置找到正确的位，并捕捉到正确的部分......所以你需要为你自己调整它......

对我来说，我的道路是

1. /Content/blah.whatever 用于 html 文件和 css 以及
2. /Scripts/some.js 等用于我的 javascript

发生的事情是 ON REFRESH ONLY 在/Content 或/Scripts 之前插入应用程序路由...下面是最终为我修复它的一组规则...

<rewrite>
  <rules>
    <rule name="Removevesseldetailsscripts" stopProcessing="true">
      <match url="^(.*[/])Scripts/(.*)$" />
      <conditions>
      </conditions>
      <action type="Redirect" url="Scripts/{R:2}" />
    </rule>
    <rule name="Removevesseldetailscontent" stopProcessing="true">
      <match url="^(.*[/])Content/(.*)$" />
      <conditions>
      </conditions>
      <action type="Redirect" url="Content/{R:2}" />
    </rule>
    <rule name="Main Rule" 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>

R:2 位是将 Angular 路径放回 url 中正确的位置，显然还有 R:1 以及捕获实际路径的根...

玩一玩，如果我能提供更多帮助，请告诉我!!祝你好运!!!