I have a scenario that prevents the same website in multiple opened tab pages of browser. My idea is when user open a website at first time from browser, it's fine, when user produces the new tab page or external link to open the same website again, we should redirect it to already opened one. I have no idea how to implement. Can I have some clues? Thanks.

I have a scenario that prevents the same website in multiple opened tab pages of browser. My idea is when user open a website at first time from browser, it's fine, when user produces the new tab page or external link to open the same website again, we should redirect it to already opened one. I have no idea how to implement. Can I have some clues? Thanks.

• javascript
• session-cookies
• session-state
• http-redirect

• "we should redirect it to already opened one" --- what does this exactly mean? – zerkms Commented Nov 18, 2015 at 0:01
• github./tejacques/crosstab + window.focus() – qwertymk Commented Nov 18, 2015 at 0:02
• not open more than one tab page for same website – crazy_develerper Commented Nov 18, 2015 at 0:13
• 1 You cannot (and should not) do that. – zerkms Commented Nov 18, 2015 at 0:13
• User can always just open use another browser or another puter to open another view onto the web site. So, basically you cannot ever prevent this. Your web-site should be able to handle multiple tabs viewing the same state. – jfriend00 Commented Nov 18, 2015 at 0:22

2 Answers 2

Perhaps use local storage.

Window.onload=function(){

if(localStorage.getItem('windows')===1){

window.close();

}else{

localStorage.setItem("windows",1);
}

}

Window.onbeforeunload=function(){
localStorage.setItem("windows",0);
}

I recently ran across a similar problem where I had to prevent that multiple windows/tabs operated on the same localStorage.

The solution was to use StorageEvents: every window receives a StorageEvent whenever another(!) window made changes to the same localStorage as this one uses.

Thus, the trick was to define a "dummy" key for localStorage and let every window write some random value into that key just to let all other windows using the same localStorage receive a StorageEvent:

  window.addEventListener('storage', () => {
    window.alert('another window or tab is working on the same localStorage')
  }, false)

  localStorage.setItem('Sentinel',Math.random())