PushState and browser refresh not working on IIS

I have been using Aurelia 1 for many years and this is my first post.

I have been struggling with browser Refreshing on IIS not working after implementing PushState and have finally managed to get this working (spent quite a while on this). The following is what worked for me and hope these details are of some assistance to anyone facing a similar problem.

The problem was when publishing the app to IIS where we have a UAT and a PRD environments and each enviromnent has a UI and and API section (using .NET Core). So, the url to start the the app in UAT would be https://thesite.com/uat/ui and for PRD is https://thesite.com/prd/ui.

After implementing pushstate, the application worked ok but what was happening was, once the app was launched, the entered url (https://somesite.com/uat/ui) would be changed to https://somesite.com/welcome (welcome is the default page) where the displayed url in the browser would be missing the /uat/ui. In order to ensure the browser url retained the dropped /uat/ui, the following changes were made:

  • in webpack.config set baseUrl = ‘’; //if deploying to iis.
  • change the deployed index.html
  • in aurelia, ensure the configureRouter method has the following:
    config.options.pushState = true;
    config.options.root = ‘/uat/ui/’

After the above changes, launching the app via https://somesite.com/uat/ui would load the app and display the welcome page and the url in the browser would display https://somesite.com/uat/ui/welcome. So, in theory, browser refresh should work.

In order to now get the browser refresh to work, the following was required:

  • ensure IIS URL Rewrite extension is installed on the Windows server.
  • create a Web.Config file in the /uat/ui directory to force IIS to load the index.html. The following is an extract from the web.config file and what worked for me. FWIW, IIS Manager has a URL Rewrite option that can be launched from the virtual directory to setup the web.config file.
 <configuration>
    <system.webServer>
   <rewrite>
             <rules>
                 <remove name="redirect all requests" />
                 <rule name="redirect all requests" stopProcessing="true">
                     <match url="^(.*)$" ignoreCase="false" />
                     <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" appendQueryString="true" />
                 </rule>
             </rules>
         </rewrite> 
    </system.webServer>
</configuration>
1 Like