Determine if the browser already opened an URL

Question

We use an internal system (with FF as default browser)

We need to avoid that the user open the same URL in different tabs. As the tabs share the same PHP session we get a mess. So actually I'm looking to the way to check programmatically if certain URL is already opened in one of the opened tabs. Client side (JS) or server side (PHP).

We use now the FF extension "Duplicate Tabs Closer" that helps. But I'd prefer to keep full control (give warning, choose for which URL it works).

score 2 · Accepted Answer · answered Sep 08 '18 at 10:07

2

You can write cookie after your page loaded in the first tab, check it on the server side and show the user warning instead of actual page content if this cookie is set and the second tab is opened. To handle the case when a user closes the only opened tab you can remove that cookie in onbeforeunload handler.

answered Sep 08 '18 at 10:07

Oleksandr Kovpashko

764
4
11

Thank you for your suggestion I try onbeforeunload https://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_onbeforeunload but it doesn't work in my FF ( it works with Chrome) – Alexander P Sep 08 '18 at 13:20
Try to set `onbeforeunload` handler to the `window` object instead of to `body`. Here is an example http://jsfiddle.net/urogqmkp/3/. PS: w3schools is not the best source of knowledge. It's better to use https://developer.mozilla.org or http://devdocs.io. – Oleksandr Kovpashko Sep 08 '18 at 13:28
Thank you, I was already testing it. (window object) :) With quite a strange result in FF. I get it fired on click and on reload. But not on close. But if I open dev console (F12) before closing the tab it is fired on close too. – Alexander P Sep 08 '18 at 13:53
You right. I haven't often used `onbeforeunload` handler in my practice and looks like I've missed that firefox removed an ability to show a confirmation message from this handler. But the handler works and it's called before a tab closed. You can easily check it in the following example http://jsfiddle.net/urogqmkp/17/. Open example, look in the console, close tab, open again and look in the console again. – Oleksandr Kovpashko Sep 08 '18 at 14:19
I finally figured it out. According to [this answer](https://stackoverflow.com/a/37362297/3921253), Firefox checks if a user interacts with a page and shows popup only if there were keyboard or mouse events. So if you click somewhere in the result section of my first example in Firefox and try to close tab you should see a popup. – Oleksandr Kovpashko Sep 08 '18 at 14:32

score 2 · Answer 2 · answered Sep 08 '18 at 14:49

Working off of Oleksandr's answer, you can store a map of number of times a url is opened, in a cookie. When a page is opened, increment the number or set it to 0. When a page is closed, decrement it or delete it.

function incrementTabsOpen() {
    let tabsOpen = readObjCookie('tabsOpen') || {};
    if (tabsOpen[window.location.href]) tabsOpen[window.location.href]++;
    else tabsOpen[window.location.href] = 0;
    writeObjCookie('tabsOpen', tabsOpen);
}
function decrementTabsOpen() {
    let tabsOpen = readObjCookie('tabsOpen') || {};
    if (tabsOpen[window.location.href]) tabsOpen[window.location.href]--;
    if (tabsOpen[window.location.href] === 0) delete tabsOpen[window.location.href];
    writeObjCookie('tabsOpen', tabsOpen);
}

// https://stackoverflow.com/a/11344672/3783155
function readObjCookie(name) {
    let result = document.cookie.match(new RegExp(name + '=([^;]+)'));
    if (result) result = JSON.parse(result[1]);
    return result;
}
function writeObjCookie(name, value) {
    document.cookie = name + '=' + JSON.stringify(value);
}

and

window.addEventListener('load', function() {
    incrementTabsOpen();
};
window.addEventListener('unload', function() {
    decrementTabsOpen();
};

Determine if the browser already opened an URL

2 Answers2