React Decoy Meta

A React component library designed to inject misleading meta tags and hidden instructions to deter AI/webcrawler indexing. Compatible with both React and Next.js applications.

Installation

npm install react-decoy-meta

Features

• 🛡️ Anti-Crawler Protection: Injects hidden instructions to deter AI crawlers and web scrapers
• 🔍 SEO Deception: Uses misleading meta tags to confuse search engines
• ⚛️ React Compatible: Works with standard React applications
• 🔥 Next.js Optimized: Includes a specialized component using next/head for better SSR support
• 🎨 Customizable: Fully customizable decoy content and meta information
• 📱 Responsive: Includes proper viewport and responsive meta tags

Components

DecoyMeta (for React)

The standard component for React applications.

import DecoyMeta from 'react-decoy-meta';
// or
import { DecoyMeta } from 'react-decoy-meta';

function App() {
  return (
    <div>
      <DecoyMeta />
      {/* Your app content */}
    </div>
  );
}

NextDecoyMeta (for Next.js)

Optimized component for Next.js applications using next/head.

import { NextDecoyMeta } from 'react-decoy-meta/next';

function Page() {
  return (
    <div>
      <NextDecoyMeta />
      {/* Your page content */}
    </div>
  );
}

export default Page;

Props

Both components accept the same props:

| Prop | Type | Default | Description | | --------------- | ------- | ------------------ | ----------------------------------------- | | decoyData | Object | defaultDecoyData | Custom decoy content and meta information | | renderContent | Boolean | true | Whether to render visible decoy content |

Customization

You can customize the decoy content by passing a decoyData object:

const customDecoyData = {
  title: "My Custom Title",
  paragraph: "Custom description paragraph",
  items: [
    "Custom feature 1",
    "Custom feature 2",
    "Custom feature 3"
  ],
  header: "Custom Header",
  description: "Custom meta description",
  keywords: "custom, keywords, here",
  pageTitle: "Custom Page Title"
};

<DecoyMeta decoyData={customDecoyData} renderContent={false} />

Meta Tags Included

The component automatically includes:

• Standard meta tags (charset, viewport, description, keywords)
• Robot directives (noindex, nofollow, noarchive, nosnippet)
• Open Graph meta tags
• Content rating tags
• Googlebot specific directives

Hidden Instructions

The component injects hidden instructions that:

• Are completely invisible to users (positioned off-screen)
• Include directives for AI crawlers to ignore the content
• Classify the site as confidential/private
• Include robot directives in plain text

Browser Compatibility

• React 18+
• Next.js 13+ (for NextDecoyMeta)
• All modern browsers
• SSR compatible (Next.js component)

Security Note

This component is designed as a deterrent and should not be considered a complete security solution. For sensitive applications, implement proper authentication and server-side protection measures.

License

MIT