How to Detect Browser Refresh Using Angular

How to detect refresh page and redirect to another page

your code is correct, but you can't stop browser refresh the page after router navigate to another page

I create a sample for you, hope it can help you.

live example

more references

  • window.onbeforeunload not working

How to check refresh page event in angular 8 and show a dialog asking user to Reload or cancel action

In angular, you can achieve it using HostListener and onbeforeunload event.
Follow the example here which explains, the exact answer of your question.

How can I detect a page refresh in an angularjs single page application without configuring routes?

You can't for sure, because a browser page refresh is equivalent to exiting the app then opening it again.

What you can do is detect the page exit event and the app open event.

In the block inject 'window' dependency and add:

window.onbeforeunload = function () {
// handle the exit event

and on $routeChangeStart event

$rootScope.$on('$routeChangeStart', function (event, next, current) {
if (!current) {
// handle session start event

And if definitely you need to link these two events it has to be on the backend/server side ....

I hope this helps.

Related Topics

Leave a reply