Getting 404 error on page refresh in Angular 4

user_4490294 0
Viewed 3102

We have deployed angular 4 application using 'ng build --prod' cli command and created 'dist' folder hosted on IIS 8.5, when we run the application then it's working fine but if pressed F5 key then getting 404 error.

Note: please don't suggest to use (useHash:true) if suggested then how we can remove '#' from url.

Appreciated help if some one can suggest us.

iis-8.5 angular
1 Answers

You can write change your web.config file like below 

<configuration>
    <system.webServer>
         <rewrite>
            <rules>
              <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>
          <caching enabled="true" enableKernelCache="true">
              <profiles>
                  <add extension=".js" policy="DisableCache" kernelCachePolicy="DisableCache" />
              </profiles>
          </caching>
    </system.webServer>
</configuration>

let's i explain more this configuration

<match url=".*" />

this match all url which is coming and than it's redirect in your base path using action

<action type="Rewrite" url="/" />

If you have set your project in subfolder than change your url="/subfolder/".

user_45330730
Related