anti-screenshot-lib v1.0.2

AntiScreenshot Library

AntiScreenshot is a JavaScript library that prevents screenshots, screen recordings, and unauthorized access to website content. It supports multiple frontend frameworks including Angular, React, Vue, and Vanilla JS.

Features

• Prevents screenshots using keyboard shortcuts
• Detects screen recording
• Blurs content on suspicious activity
• Detects and blocks developer tools
• Disables right-click context menu
• Detects cursor movements and clicks outside the browser window
• Prevents unauthorized DOM manipulation
• Customizable system-wise restrictions (Windows, Mac, Linux)
• Watermark support for content protection

Installation

Using NPM

npm install anti-screenshot-lib

Using for types in typescript

npm install --save-dev @types/anti-screenshot-lib

Using CDN

<script src="https://cdn.example.com/anti-screenshot-lib.min.js"></script>

Usage

Vanilla JS

import AntiScreenshot from "anti-screenshot-lib";

const antiScreenshot = new AntiScreenshot({
  blockShortcuts: true,
  detectRecording: true,
  blockDevTools: true,
  targetElements: ["#protected-content"],
  systemConfigs: {
    windows: { blockNavigationKeys: true },
    mac: { blockSpecialCharacters: true },
    linux: { blockAllKeys: true },
  },
});

Angular

1. Install the library:

   npm install anti-screenshot-lib

2. Use it in your component:

   import { Component, OnInit } from "@angular/core";
   import AntiScreenshot from "anti-screenshot-lib";
   
   @Component({
     selector: "app-root",
     templateUrl: "./app.component.html",
     styleUrls: ["./app.component.css"],
   })
   export class AppComponent implements OnInit {
     ngOnInit() {
       new AntiScreenshot({
         blockShortcuts: true,
         detectRecording: true,
       });
     }
   }

React

1. Install the library:

   npm install anti-screenshot-lib

2. Use it in your component:

   import React, { useEffect } from "react";
   import AntiScreenshot from "anti-screenshot-lib";
   
   const App = () => {
     useEffect(() => {
       new AntiScreenshot({
         blockShortcuts: true,
         detectRecording: true,
       });
     }, []);
   
     return <div id="protected-content">Protected Content</div>;
   };
   
   export default App;

Configuration Options

License

This project is licensed under the MIT License.