Need a Unique ID in javascript for tab windows and for new windows in Internet Explorer [duplicate]

Question

Need a simple approach to get a Unique ID in javascript for tab windows in Internet Explorer. I basically was wondering if there is something like document.tab.indexnumber, which there is not. So the real question is if there is anything that can be used to generated this or find out what tab you are in ? Similarly I should be able to get another unique id for another instance of internet explorer ?
I cannot use an IE addon for this.

An additional complication is that we could use a random number generator plus timestamp for a unique id as suggested below in one of the answers. But how can I keep this same number across the same session for that tab. If I store it in a session variable it is shared between all tabs/windows with that session.

We could put the id in the url or a hidden field, but that solution would be to intrusive to the design of the site. Looking for something less intrusive.

Answer 1

I'm working in a custom Session class for the ASP.Net framework (both WebForms and MVC flavors).

Although very old, this question is very pertinent and I could not find any other addressing the problem given.

Hence, I share the solution I coded to ensure a unique and persistent GUID for each window and/or tab, kept static and secured no matter how hard one refreshes, navigates outside the site and returns, cleans the cache, etc.

The magic involves window.name and is implemented by the JavaScript code below. The bootstrap is based on jQuery, but easily portable to jQuery-less solutions.

Notice that this GUID is automatically appended to any existing form's providing server-side references.

---

UIGUID.js

---

Edited: the original version presented an error at windowLoadSetGUIDOnForms for formList.length == 1

//------------------------------------------------------------------------------
//-- guarantees that window.name is a GUID, and that it would
//-- be preserved whilst window life cicle
//--
//-- for frames and iframes, the outermost window determines the GUID
//--
//-- for every form it will be appended a hidden element of id
//-- "this.window.GUID" for server-side references
//------------------------------------------------------------------------------
//-- window.name will be set to "GUID-<A_GUID>"
//------------------------------------------------------------------------------

//------------------------------------------------------------------------------
//-- Retrieves window GUID, initializing it if necessary -----------------------
//------------------------------------------------------------------------------

function getWindowGUID() {
    //----------------------------------
    var windowGUID = function () {
        //----------
        var S4 = function () {
            return (
                    Math.floor(
                            Math.random() * 0x10000 /* 65536 */
                        ).toString(16)
                );
        };
        //----------

        return (
                S4() + S4() + "-" +
                S4() + "-" +
                S4() + "-" +
                S4() + "-" +
                S4() + S4() + S4()
            );
    };
    //----------------------------------

    //-- traverses up in the hierarchy for the outermost window ----------------

    var topMostWindow = window;

    while (topMostWindow != topMostWindow.parent) {
        topMostWindow = topMostWindow.parent;
    }

    //-- initialize GUID if needed ---------------------------------------------

    if (!topMostWindow.name.match(/^GUID-/)) {
        topMostWindow.name = "GUID-" + windowGUID();
    }

    //-- return GUID -----------------------------------------------------------

    return topMostWindow.name;
} //-- getWindowGUID -----------------------------------------------------------

//------------------------------------------------------------------------------
//-- Append via jQuery handlers for windowLoad ---------------------------------
//------------------------------------------------------------------------------

$(window).load(
    function () {
        windowLoadSetGUID();
        windowLoadSetGUIDOnForms();
    }
) //----------------------------------------------------------------------------

function windowLoadSetGUID() {
    var dummy = getWindowGUID();
} //-- windowLoadSetGUID -------------------------------------------------------

function windowLoadSetGUIDOnForms() {
    var formList = $('form');
    var hidGUID = document.createElement("input");

    hidGUID.setAttribute("type", "hidden");
    hidGUID.setAttribute("name", "this.window.GUID");
    hidGUID.setAttribute("value", getWindowGUID());

    if (formList.length == 1) {
        formList.append(hidGUID);
    }
    else {
        for (var i = 0; i < formList.length; ++i) {
            formList[i].append(hidGUID);
        }
    }
} //-- windowLoadSetGUIDOnForms ------------------------------------------------

As POC, I devised two HTML scripts demonstrating the uniqueness even at child elements in frames or iFrames

---

GUIDTest.html

---

<html>
  <head>
    <script language="javascript" type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
    <script language="javascript" type="text/javascript" src="UIGUID.js"></script>
  </head>
  <body onLoad="alert('Main document: ' + getWindowGUID());">
    <iframe id="frame001" src="GUIDFrame.html"></iframe>
    <iframe id="frame002" src="GUIDFrame.html"></iframe>
  </body>
</html>

---

GUIDFrame.html

---

<html>
  <head>
    <script language="javascript" type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
    <script language="javascript" type="text/javascript" src="UIGUID.js"></script>
  </head>
  <body onLoad="alert('iFrame: ' + getWindowGUID());" />
</html>