IIS URL Rewrite for nested application

Question

I have SPA developed in React and back-end as ASP.NET Web API. The React application is hosted in IIS and have a rewrite URL so if the page is refreshed the page stays. The URL rewrite looks like

          <rules>
            <rule name="ReactJS 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>

Now I hosted Web API application as a child application (nested application) in IIS with React application as parent. Now the issue is when the front-end application makes a request to Web API I get 403 - Forbidden: Access is denied. I checked and both the parent and child applications have Require SSL unchecked. When I removed the rewrite rule in web.config everything is working except I cannot refresh the page. So how to have rewrite rule with the nested application. Just to provide more details, we are using IIS 10 and name of the site is ReactApp and WebApiApp (child application). The application runs in https.

Answer 1

I fixed it by adding the following in rewrite url <match url="^((?.childapp).)*$" /> where childapp is the name of the nested application. So basically saying that if it is not Web API call then use the rule otherwise ignore the rule for the back-end API calls.