Angular Routing in IIS server

Question

I have an Angular 4 app in a IIS server, in the same server there is a .NET Web API. They are in diferents folders: angular app is in "/wwwroot/angular/" and web api in "/wwwroot/api/". When I do a request to web api, it works successfully, but when I try to navigate to an URL different to index.html using the Routing Module in angular app I get this message:

500 - Internal server error. There is a problem with the resource you are looking for, and it cannot be displayed.

Also, I have two Web.Config files -one in each folder-.

My Angular Web. Config is:

<system.webServer>
 <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"/>
     </conditions>
     <action type="Rewrite" url="/index.html" />
   </rule>
  </rules>
 </rewrite>
</system.webServer>

Web.config of WEB API

<configuration>
 <system.webServer>
  <handlers>
    <remove name="ExtensionlessUrlHandler-Integrated-4.0" />
    <remove name="OPTIONSVerbHandler" />
    <remove name="TRACEVerbHandler" />
    <add name="ExtensionlessUrlHandler-Integrated-4.0" path="*." verb="*" type="System.Web.Handlers.TransferRequestHandler" preCondition="integratedMode,runtimeVersionv4.0" />
  </handlers>
 </system.webServer>
</configuration>

I researched in some questions like:

stackoverflow.com/questions/49833141/blank-page-when-publishing-angular-5-net-core-web-api

and

stackoverflow.com/questions/42865084/redirect-unknown-requests-to-index-html-in-springboot

But they doesn't work to me.

Anybody help me on this.

Thanks in advance.

You need to redirect every request except the assets like images etc. to the index.html. — Lazar Ljubenović
– Lazar Ljubenović, Commented Aug 2, 2018 at 17:54

MikeGsus · Accepted Answer · 2018-08-08 16:29:09Z

The solution was move all the Angular files to root, at index.html I left <base href="/"> and make the web.config like this:

<?xml version="1.0" encoding="UTF-8"?>
<configuration>
 <system.webServer>
    <rewrite>
        <rewriteMaps>
            <rewriteMap name="^(.*)$" />
        </rewriteMaps>
        <rules>
            <rule name="Angular Route" stopProcessing="true">
                <match url="^(.*)$" />
                <conditions logicalGrouping="MatchAll">
                    <add input="{REQUEST_URI}" pattern="/api(.*)$" negate="true" />
                    <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
                </conditions>
                <action type="Rewrite" url="/index.html" />
            </rule>
        </rules>
    </rewrite>
    <security>
        <authorization>
            <remove users="*" roles="" verbs="" />
            <add accessType="Allow" users="?" />
        </authorization>
    </security>
 </system.webServer>
</configuration>

Vaibhav · Accepted Answer · 2018-08-02 17:56:55Z

1

In your web.config change <action type="Rewrite" url="/FIN360" /> and in your index.html from the <base href="/"> remove the / Try this else change <base href="./"> OR <base href="/FIN360">

answered Aug 2, 2018 at 17:56

Vaibhav

1,50713 silver badges17 bronze badges

5 Comments

MikeGsus Over a year ago

Do I deploy with ng build --prod, whitout --base-href=/FIN360/?

MikeGsus Over a year ago

I get the same message: 500 - Internal server error. There is a problem with the resource you are looking for, and it cannot be displayed.

Vaibhav Over a year ago

build it with ng build --prod -base-href=/FIN360 and do restart your application pool in iis and post that do the rewuest in incognito window or clear the cache of the browser.

MikeGsus Over a year ago

I did it, but I've a new problem, like this: link to question

Vaibhav Over a year ago

@MikeGsus I have answered on that question itself

Collectives™ on Stack Overflow

Angular Routing in IIS server

2 Answers 2

Comments

5 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

5 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related