Location Strategy while hosting on IIS server

Question

I was running my application on local server, it was working fine, when we hosted it, it started working okay untill i refreshed the page and the 404 error occured.

then i came up with the solution of using HashLocationStrategy. It worked very well. But it added up a '#' symbol in my url as 'http://everest.syslogix.ca/#/fastcom/admin-dash'. But it was working very well. After that i wanted to add linkedIn signIn in this application but it required a trusted url without the '#' symbol.

Now what should i do? I've searched all over the internet, tried many solutions but none of them worked for me. I want a URL either without hash which works fine while i reload the page. Or i want some way to enable URL with hash to be stored as a trusted URL on linkedIn.

Answer 1

Solved!!

1- Make a file web.config with the text as :-

<?xml version="1.0" encoding="utf-8" ?>
<configuration>
  <system.web>

  </system.web>
<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>
</configuration>

2- Place this file inside the src folder. 3- Modify your angular.json file to include the web.config file, in the assets tag as :

"

assets": [
              "src/favicon.png",
              "src/assets",
              "src/web.config"
                        ],

4-ng build --prod 5-Publish and enjoy.

Answer 2

You have to add rewrite rule to web.config file and put it at production build folder, you can also find documentation on same here.

 <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>