Solving Angular Routing 404 Errors on Page Refresh

Angular is a Single Page Application, when user navigate to different page and refresh then new url is not recoganized result throws 404 page not found error in web browser. 

404 Errors on Page Refresh

Solution:

Add below code in app.module.ts 

inside imports add useHash: true
RouterModule.forRoot(routes, { useHash: true }),
Add this inside providers 
{provide: HTTP_INTERCEPTORS, useClass: AppHttpInterceptor, multi: true},

Now you should able to load correctly.

HTTP Interceptors as Your Exception Handling Heroes

 

3 Replies to “Handling Angular 404 Errors on Page Refresh”

Leave a Reply

Your email address will not be published. Required fields are marked *