How to make the user not duplicate browser tabs?

Question

There was a task to make each web page of the project not repetitive. Those. the user should not, as a consequence of inattention within the same browser, open multiple duplicates of the same web page. Please suggest a specific solution.

Answer 1

The task can be solved very simply, if one condition is met — each page has its own unique identifier. I have this $(‘body’).attr (‘id’). Let’s call the function noDuplicateTabs and call it every time the page starts. We use localStorage:

let noDuplicateTabs = function (pageName) {
  localStorage.getItem(pageName)
  ? window.close()
  : localStorage.setItem(pageName, 'open');

  window.onbeforeunload = function () {
     localStorage.setItem(pageName, '');
  };
}

Thus, we pass the name of the page in the function, check for the presence of a value using the localStorage key corresponding to the page name. If a key with a non-empty value is found, then we close the page, if not, then write the value to it ‘open’.

We also use the onbeforeunload property of the window, which works before reloading or closing the page. In this case, we will erase the value. Now there will be no duplicates within the same browser.