<p>I am working on an angular application and deployed it in kubernetes. I can access my application through Nginx Ingress.</p>
<p>I am using angular router to enable navigation through different components in my app.</p>
<p><em>Using the deployed application i tried to navigate through different components, when I click refresh on the browser or directly access a specific url path, I get 404 Not Found Page.</em></p>
<p>For example, if one accesses URL <code>mycompany.domain.com</code>, it shows the home component. In my angular router I have a <code>/user</code> path that points to user component.</p>
<p>Upon navigating to user menu, my new URL will now be <code>mycompany.domain.com/user</code> - and it is all working as expected.
However if I refresh the current page, it will become 404 Not Found Page, which is the problem.</p>
<p><strong>My few thoughts:</strong></p>
<ol>
<li>The router is part of the SPA, and of course will be loaded once the SPA is loaded.</li>
<li>The url path <code>/user</code> is only known by the router in the SPA - and so when we try to access the mycompany.domain.com/user directly, the server does not find any resource matching to it.</li>
<li>The only one who can understand the <code>/user</code> url path is my SPA - which is not loaded yet because the server already decided that the resource is not found.</li>
</ol>
<p>So I concluded (but still to try) the problem can occur anywhere I deploy my SPA regardless my ingress or server configuration.</p>
<p><strong>My solution</strong> is using angular router <code>useHash</code> option - it means that my navigation path will be after a # and be considered as URL Fragments, like this: mycompany.domain.com/#/user, in this case, my server will not try to understand the fragment, as it is meant to be understood by the page. I did so inspired by Vue.js router.</p>
<p><strong>My questions are:</strong></p>
<ol>
<li>Is my understanding (and conclusion) correct?</li>
<li>Is there any other solution? Because Angular by default doesn't use the hash and I am sure that there is a reason for that because it is not making sense if its doesn't work when deployed?</li>
<li>Can URL Rewriting help me? I have tried to look for it myself the usage is not matching with my conclusions.</li>
</ol>
<p>I am not a SPA expert, I am just starting and I would appreciate if someone will correct and answer me.</p>

<p><strong>Save This code as web.config then paste the web.config file in the dist folder</strong></p>
<pre><code>&lt;?xml version=&quot;1.0&quot; encoding=&quot;UTF-8&quot;?&gt;
&lt;configuration&gt;
  &lt;system.web&gt;
    &lt;compilation targetFramework=&quot;4.0&quot; /&gt;
    &lt;customErrors mode=&quot;On&quot; redirectMode=&quot;ResponseRewrite&quot;&gt;
      &lt;error statusCode=&quot;404&quot; redirect=&quot;/index.html&quot; /&gt;
    &lt;/customErrors&gt;
  &lt;/system.web&gt;
  &lt;system.webServer&gt;
    &lt;httpErrors errorMode=&quot;Custom&quot;&gt;
      &lt;remove statusCode=&quot;404&quot;/&gt;
      &lt;error statusCode=&quot;404&quot; path=&quot;/index.html&quot; responseMode=&quot;ExecuteURL&quot;/&gt;
    &lt;/httpErrors&gt;
  &lt;/system.webServer&gt;
&lt;/configuration&gt;
</code></pre>
