Meteor: Log out when all tabs are closed

Source: Internet
Author: User

Function Description: Log out when the browser exits (all tabs are closed)

Source of demand: support for remember me option similar to traditional Web login

Background: In the Meteor app, when the user logs in, the resume token is saved in the browser's localstorage, so the next time you use the browser to open the same Meteor app, you will automatically log in. Sometimes we want the app to sign out when the browser exits (all tabs close), but Meteor is not native to this feature and needs to be implemented by ourselves.

Important: How to detect tab close, how to detect all tab closures

How to log Out

Call Meteor.logout ()

How to Detect tab close

We want to exit the login when tab closes, then we have to have a method to detect tab close. We can register the listener with the browser Beforeunload event. For example:

function () {   meteor.logout ();
});
How to detect All tab close

Based on the login mechanism of meteor, when users open multiple tabs in the same browser, they are logged in the same situation. If you rely on the above code only, then any tab close will cause the user to log out. The logic we want is for the browser to close, or all of the app's tabs to close before exiting the login.

Maybe there's a better solution, here's just one of my solutions: Use the browser's localstorage to record the number of tabs that are open for the current app when you close the tab

    function () {        = Meteor._localstorage.getitem (opentabcountkey);         = count? Number (count) + 1:1;        Meteor._localstorage.setitem (Opentabcountkey, count);    });    $ (window). On (function  () {        -1);    });

Here are a few small details to note:

    1. Use Meteor._localstorage instead of window.localstorage for better compatibility
    2. The Localstorage store is full of strings, so we're going to format the conversion
    3. Declares a constant Opentabcountkey
    4. The concurrency of this operation is very small, ignoring the state synchronization problem

After logging the tab open Quantity, we can fix the above code:

    function () {        = number (Meteor._localstorage.getitem (Opentabcountkey)); if (! (Count > 0) ) {            meteor.logout ();        }    });
Wipe your butt.

With the code above, the app should have the functionality we expected: Log out when the browser is closed, or when all of the app's tab is closed.

And then, smart you might find that when you open the app again, the console displays an error message: ... (to the effect that you are forced to log on by the server)

If you look at the meteor.logout source, you should be able to know why: The method first called the server-side method, the server to clear the relevant resume token, and then the client in the callback to clear the local saved resume token.

However, although the service side cleared the resume token, we did not wait until the client responded by closing the tab (the app was closed), so there was no way to perform client-related cleanup in the callback. Therefore, we need to perform client cleanup in a synchronized and visible manner. The revised code is as follows:

    function () {        = number (Meteor._localstorage.getitem (Opentabcountkey)); if (! (Count > 0) && shouldlogout) {            meteor.logout ();            Accounts.makeclientloggedout ();        }    });
Summary

Add some methods to support setting and canceling the attribute.

The relevant code is as follows:

 /*  * * logout when all tabs is closed    * @param {Boolean} setit-default true  */  Logoutonclose (Setit  = true  ) { if   (Setit) {Meteor._localstorage.setitem (Oncloselogoutkey,  true  );  else   {meteor._localstorage.        RemoveItem (Oncloselogoutkey); }    }
    Willlogoutonclose () {        return  Boolean (Meteor._localstorage.getitem ( Oncloselogoutkey))    }
    function () {        = Meteor._localstorage.getitem (opentabcountkey);         = count? Number (count) + 1:1;        Meteor._localstorage.setitem (Opentabcountkey, count);    });    $ (window). On (function  () {        -1);    });
    function () {        = number (Meteor._localstorage.getitem (Opentabcountkey));         = Boolean (Meteor._localstorage.getitem (Oncloselogoutkey));         if (! (Count > 0) && shouldlogout) {            meteor.logout ();            Accounts.makeclientloggedout ();        }    });

Meteor: Log out when all tabs are closed

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.