Skip to content

ankitjha2603/single-tab-lock

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

9 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

single-tab-lock

npm version License: Apache-2.0

An npm package to restrict users from opening multiple tabs of a single website.

Installation

npm install single-tab-lock

Usage

import { preventMultipleTabs } from "single-tab-lock";

// Example usage with default values
preventMultipleTabs();

// Customized usage with options
preventMultipleTabs({
  errorMessage: "Custom error message",
  expiryTime: 2000,
  onMultipleTabsDetected: () => {
    console.log("Multiple tabs detected callback");
    // Additional actions on multiple tabs detected
  },
  config: { updateSpeed: 5 },
});

Options

options (Object, optional)

Options object for customizing the behavior.

{
  // Custom error message to display when multiple tabs are detected. Default is a generic message.
  errorMessage: "Custom error message",

  // The time gap (in milliseconds) that determines the threshold for considering a tab as "offline". Default is 1000 milliseconds.
  expiryTime: 2000,

  // A callback function to be executed when multiple tabs are detected. Default is `default_on_multiple_tabs_detected`.
  onMultipleTabsDetected: () => {
    console.log("Multiple tabs detected callback");
    // Additional actions on multiple tabs detected
  },

  // Configuration object for internal processing.
  config: {
    // The speed of internal updates (frames per second).
    updateSpeed: 5,
  },
}

Notes

  • This package, single-tab-lock, provides a simple mechanism to prevent users from opening your web application in multiple tabs simultaneously.

  • LocalStorage Usage: The package uses localStorage to track the status of the tab. Ensure that your users have localStorage enabled for your domain. Users with disabled localStorage might not experience the intended behavior.

  • Fallback Mechanism: It's recommended to implement a fallback mechanism for scenarios where users have disabled localStorage or are using browsers that do not support it.

  • Customization: The animation section in the code can be customized or disabled based on your specific requirements. Adjust the config object in the function call to control the internal processing speed.

  • Security Considerations: Keep in mind that client-side solutions like this can be manipulated by users. If security is a critical concern, consider combining this approach with server-side validation.


## License

`Apache License Version 2.0, January 2004 (http://www.apache.org/licenses/)`

About

An npm package to restrict users from opening multiple tabs of a single website.

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published