0

I have a singlepage application build with Angular 9 and I would like to use urls withoug a hashtag to navigate.

I enabled pushState / HTML5 mode by defining useHash

RouterModule.forRoot(routes,{useHash: false})

and in the index.html the "base entry:

<head>
    <base href="/" />

so far everything looks ok, but i see, that when requesting a site directly: instead of:

http://localhost:4200/#/upload?transactionId=100603804

using

http://localhost:4200/upload?transactionId=100603804

the whole angular application is reloaded again from the server. How could it be arranged, that i can use the links without '#' and also to avoid the reloading?

best regards

shane

Shannon
  • 731
  • 3
  • 12
  • 26
  • When doing that, some configuration is necessary on your server because you are requesting a resource that does not really exist (`/upload`). A rewrite rule must be written so that the server will understand that it should actually serve `index.html` – Arnaud Denoyelle Feb 10 '21 at 17:13
  • The following answer is about angularJs but the logic is the same : https://stackoverflow.com/questions/15284038/rewrite-rules-for-apache-2-to-use-with-angular-js – Arnaud Denoyelle Feb 10 '21 at 17:14
  • I thought that modern browsers do not reload the whole application. Isn't it that he HashLocationStrategy is only needed to support older browsers? – Shannon Feb 10 '21 at 17:34
  • What do you mean by `the whole angular application is reloaded again from the server` ? If you type that in the url and press enter, of course it will reload the whole application. But if place a button that triggers `router.navigate()`, it will just navigate without whole reloading – Arnaud Denoyelle Feb 10 '21 at 17:58

0 Answers0