【问题标题】:IIS allowing routing to virtual dirIIS 允许路由到虚拟目录
【发布时间】:2019-02-08 10:05:27
【问题描述】:

我正在尝试将我的 Angular 应用程序和 api 托管在 Azure 上的同一个 Web 应用程序中。 但我在访问我的 api 时遇到了一些困难。

文件夹结构如下:

├───api
│   └───bin
│   └───web.config <== API web.config
├───index.html
├───web.config <== Angular web.config
├───...
└───assets
    ├───flags
    ├───i18n
    ├───icons
    └───images

所以我需要告诉我的 Angular web.config 将所有 /api 调用重定向到 api。同时仍将所有其他调用还原到根文件夹中的index.html

但我似乎无法正确理解,这是我当前的 web.config。但这会将我的 api 调用重定向到客户端的 index.html。

<?xml version="1.0" encoding="utf-8" ?>
<configuration>
  <system.webServer>
    <staticContent>
        <remove fileExtension=".woff" />
        <remove fileExtension=".woff2" />
        <remove fileExtension=".ttf" />
        <mimeMap fileExtension=".woff" mimeType="font/woff" />
        <mimeMap fileExtension=".woff2" mimeType="font/woff2" />
        <mimeMap fileExtension=".ttf" mimeType="font/ttf" />
        <mimeMap fileExtension=".webmanifest" mimeType="application/manifest+json" />
        <clientCache cacheControlMode="UseMaxAge" cacheControlMaxAge="1.00:00:00" />
    </staticContent>
    <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" />
            <add input="{REQUEST_URI}" pattern="^/(api)" negate="true" />
          </conditions>
          <action type="Rewrite" url="." />
        </rule>
      </rules>
    </rewrite>
   <!-- gzip compression -->
    <httpCompression directory="%SystemDrive%\inetpub\temp\IIS Temporary Compressed Files">
      <scheme name="gzip" dll="%Windir%\system32\inetsrv\gzip.dll" staticCompressionLevel="9" />
      <dynamicTypes>
        <add mimeType="text/*" enabled="true" />
        <add mimeType="font/*" enabled="true" />
        <add mimeType="message/*" enabled="true" />
        <add mimeType="application/x-javascript" enabled="true" />
        <add mimeType="application/javascript" enabled="true"/>
        <add mimeType="application/json" enabled="true" />
        <add mimeType="*/*" enabled="false" />
      </dynamicTypes>
      <staticTypes>
        <add mimeType="text/*" enabled="true" />
        <add mimeType="font/*" enabled="true" />
        <add mimeType="message/*" enabled="true" />
        <add mimeType="application/x-javascript" enabled="true" />
        <add mimeType="application/javascript" enabled="true"/>
        <add mimeType="application/atom+xml" enabled="true" />
        <add mimeType="application/xaml+xml" enabled="true" />
        <add mimeType="*/*" enabled="false" />
      </staticTypes>
    </httpCompression>
    <urlCompression doStaticCompression="true" doDynamicCompression="true" />
  </system.webServer>

   <location path="index.html">
      <system.webServer>
          <staticContent>
            <clientCache cacheControlMode="DisableCache" />
          </staticContent>
      </system.webServer>
    </location>

    <system.web>
      <customErrors mode="Off"/>
    </system.web>
</configuration>

这会产生以下清单

  • 加载角度应用 => TRUE
  • 加载文件(favicon、main.js、ngsw-worker.js)=> TRUE
  • 加载 manifest.webmanifest => TRUE
  • 加载 api => FALSE

有人知道web.config 的工作原理吗?

更新:通过将 manifest.webmanifest 添加到静态内容中修复了 manifest.webmanifest 问题

【问题讨论】:

  • 任何错误信息?
  • 这会将我的 api 调用重定向到客户端的 index.html。 (添加到问题中)
  • 我有同样的设置。您可能需要添加 节点到您的 web.config 的角度应用程序。这将作为 节点的直接子节点。
  • @Sage 尝试这样做,但我可能需要更多关于放置位置和方式的信息,似乎它不起作用。但我在互联网上能找到的并没有真正帮助我
  • 试试这个:

标签: angular azure iis web-config


【解决方案1】:

我在 Azure 应用服务中运行了相同的设置,并且在尝试让一切正常工作时也遇到了问题。最后,我遇到的问题是我的 SPA 应用程序 web.config 被 API 应用程序继承。这在尝试调用我的 API 应用程序时导致 405 错误。

我的解决方案是调整我的 web.config 并关闭继承。

<configuration>
  <location path="." inheritInChildApplications="false">
    <system.webServer>
      <rewrite>
        <rules>
          <clear />
          <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" />
            </conditions>
            <action type="Rewrite" url="/" />
          </rule>
        </rules>
      </rewrite>
    </system.webServer>
  </location>
</configuration>



【讨论】:

    猜你喜欢
    • 2017-02-24
    • 2010-11-29
    • 1970-01-01
    • 1970-01-01
    • 2011-06-24
    • 2011-09-19
    • 2010-10-11
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多