Skip to main content

Step by step guide to fix Angular app refresh issue in IIS

If you deploy your Angular app in IIS, routing will be handled from the client. So when you refresh a page it will give you 404 error.
To get ride of the above-mentioned situation we have to follow the steps as follows:
Before deploying anything on IIS, you have to install the URL Rewriting module on the IIS server. Please refer the link.
After the installation, you should be seeing the following icon.
If you are above to deploy an Angular app when is developed with ASP.Net Core. That deployment steps are explained in my previous blog post. That blog spot explains one issue I came across when I was deploying Angular 7 App with ASP.Net Core in IIS.
So now we are done with IIS side installation next, we have to check the deployment files. You have to make sure that web.config file.
web.config should contain the followings:
 <?xml version=”1.0" encoding=”UTF-8"?>  
 <configuration>  
 <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=”/my-app/” /> -->  
 <action type=”Rewrite” url=”/” />  
 </rule>  
 </rules>  
 </rewrite>  
 </system.webServer>  
 </configuration>
If deploying to a path beneath the root(c:\inetpub\wwwroot), build the angular application with a change in base-href option in index.html. (Example: ) Or if deploying to the root then base-href option in index.html will be as 

Hope this will help someone.


Labels:

Comments

Post a Comment

Popular posts from this blog

Exit a T-SQL Cursor When Condition is met

Have you ever wanted to exit from a cursor when a condition is met? I wanted to do it. So this is how I did it. DECLARE @Field1 AS INT DECLARE @Field2 AS INT DECLARE CursorName CURSOR READ_ONLY FOR SELECT Field1, Field2 FROM TableName OPEN CursorName FETCH NEXT FROM CursorName INTO @Field1, @Field2 WHILE @@FETCH_STATUS = 0 BEGIN IF @Field1 = 1 BEGIN GOTO ENDCURSOR END FETCH NEXT FROM CursorName INTO @Field1, @Field2 END ENDCURSOR: CLOSE CursorName DEALLOCATE CursorName I have set my fonts to bold where you want to notice. So that's all I hope you will get something out of it and it is true that this is not a big deal. :)
3 comments
Read more

Common Design Principles

There are number of common design principles that, like design patterns, best practice over the years to build maintainable software. I'm up to describe some widely used design principles though out the post. Following common principle are extracted by the same book that I mentioned before ( Professional ASP.Net Design Patterns - Scott Millet ). Principles are as follows: Keep It Simple Stupid (KISS) One common issue in software programming is over-complicating a solution. So main concern of this principle is keep the code simple but not simplistic. Eventually this will avoid unnecessary complexities. Don't Repeat yourself (DRY) Main concern of this principle is to avoid the repetition. In other words this is all about abstracting out the common functionalities into a single place. Ex: If there is a price calculation method in a system. It should lay in a single place there. Tell Don't Ask The Tell, Don’t Ask principle is closely aligned with encapsulation and the assignin...
1 comment
Read more

An error occurred while starting the application in ASP.NET Core on IIS

I got this following error when I hosted my ASP.NET Core 2.2 web API on IIS. An error occurred while starting the application. .NET Core 4.6.27317.07 X64 v4.0.0.0 | Microsoft.AspNetCore.Hosting version 2.2.0-rtm-35687 (Please ignore the version numbers. Just wanted to show the error as it was.) So my first step was to change the  stdoutLogEnabled=true in web.config,  but couldn't find the logs folder. Few mins later I learnt that the  AspNetCoreModule   doesn’t create the logs folder for you by default (Hope they will fixed soon). It logs the error to the Event Viewer which says: Warning: Could not create stdoutLogFile  Path\logs\stdout_xxxxx.log, ErrorCode = -2147024893 . So, I created the the logs folder manually and here I find the real reason why it is failing. Hope this will help you guys.
Post a Comment
Read more