How to prevent same url been opened in another tab in Safari and Safari ios

Question

Created Aug ’20

Replies 1

Boosts 0

Views 2.5k

Participants 2

I am building a webpage that want users to open in only one tab in same browser.
Expectly when user open same url in second tab. an alert "Please only open this page in one tab." will pop, and window will header to another page (ex. index.html) after user click "ok" button.

I use LocalStorge which reference from here.

Code Block  window.localStorage.setItem('openOnePage', Date.now());
 var onLocalStorageEvent = function(e){
		
	 if(e.key == "openOnePage"){
	
				window.localStorage.setItem('pageAlreadyOpen', Date.now());
				}
				
				if(e.key == "pageAlreadyOpen"){
						alert("You already opened thsi page on another tab, Please only open this page in one tab.");
						window.location.href="index.html";
						return false;
				}
		
		};		 window.addEventListener('storage', onLocalStorageEvent, false);

It works fine in chrome, firefox and edge. But it doesn't work in Safari and safari ios.

I have done a lot of search and in Safari it seems like is because that Safari fires StorageEvent in same tab. I try to fix it with add !document.hasFocus() from here, but still not work.

Is there any other way to solve this problem or do same thing what I wnat in all browser?? (ideally in client-side) any help would be appreciate.

Boost

Answer 1

jlowrey OP

Mar ’21

The event listener is firing on the first event even though it comes after. 2 options are to put the adding of the event listener in a settimeout 0 or use trap that Date() string in the outer scope and check to see it is exactly the same on the inner scope. Then you know it's firing on the first event when it shouldn't be.

0