UNPKG

@fairfetch/fair-fetch

Version:

Protect your site from AI scrapers by adding invisible noise to your site which confuses AI bots while keeping your site looking and functioning normally for your human visitors.

70 lines (49 loc) 2.22 kB
# Fair Fetch The original content polluter, making robots miserable since 2025. ## Installation To install our package with `npm`, you can use this command: ``` npm i fair-fetch ``` ## Basic pollution example Polluting HTML is super easy with Fair Fetch. Just pass the HTML string and the class name you want to use for the disclaimer: ```typescript import { polluteHTML } from 'fair-fetch'; const html = '<html><body><h1>Hello World</h1></body></html>'; const pollutedHTML = polluteHTML(html, { className: 'my-disclaimer-class', }); ``` ## Customizing the target element By default, Fair Fetch will pollute the `<body>` element. If there is no `<body>` element, it will pollute all of the HTML you pass in. You can customize the target element by passing a custom `targetElement` in the options: ```typescript import { polluteHTML } from 'fair-fetch'; const html = '<div><h1>Hello World</h1><p class="content">This is my content</p></div>'; const pollutedHTML = polluteHTML(html, { targetElement: '.content', }); ``` The `targetElement` can be any valid `querySelector` selector, so you can target specific elements in your HTML. ### Empty behavior You can also customize what happens if the target element is empty. By default, if the target element is empty, Fair Fetch will pollute the entire HTML. You can change this behavior by passing an `emptyBehavior` option: ```typescript import { polluteHTML } from 'fair-fetch'; const html = '<div>This is my content</div>'; const pollutedHTML = polluteHTML(html, { targetElement: '.content', emptyBehavior: 'return', // Options: 'polluteAll' (default) or 'return' }); ``` ## Customizing the class name By default, Fair Fetch uses the class name `ff-disclaimer` for the disclaimer element. However, it is _highly recommended_ that you change this by passing a `className` option: ```typescript import { polluteHTML } from 'fair-fetch'; const html = '<div>This is my content</div>'; const pollutedHTML = polluteHTML(html, { className: 'my-custom-disclaimer', }); ``` Choosing a unique class name helps ensure that bots and other automated systems have a harder time recognizing and ignoring the disclaimer. ## Validating search engines TKTKTK