Skip to main content
A Next.js React Server Component for fetching and rendering external JavaScript files on the server-side before page rendering. This package provides secure, cached script loading with TypeScript support.

​
Installation

npm install @adunblock/server-tag-nextjs
Every rendered <script> tag must include a data-code attribute set to your Account ID (verification code). AdUnblock uses this value to verify that the script is running on your registered domain. Find your Account ID at the top of your AdUnblock dashboard.

​
Basic Usage

Import and use the ServerTag component in your Next.js pages or layouts: 
import ServerTag from "@adunblock/server-tag-nextjs";

export default function MyPage() {
  return (
    <div>
      <ServerTag
        remoteUrl="https://public.adunblocker.com/api/vendor_scripts"
        scriptAttributes={{ "data-code": "YOUR_ACCOUNT_ID" }}
      />
      <h1>My Page Content</h1>
    </div>
  );
}

​
Advanced Usage

​
Custom Caching

import ServerTag from "@adunblock/server-tag-nextjs";

export default function MyPage() {
  return (
    <div>
      <ServerTag
        remoteUrl="https://public.adunblocker.com/api/vendor_scripts"
        cacheInterval={600} // Cache for 10 minutes (default: 300 seconds)
      />
      <h1>My Page Content</h1>
    </div>
  );
}

​
Custom Script Rendering

Override the default script rendering with a custom callback: 
import ServerTag from "@adunblock/server-tag-nextjs";
import Script from "next/script";

export default function MyPage() {
  return (
    <div>
      <ServerTag
        remoteUrl="https://public.adunblocker.com/api/vendor_scripts"
        renderScript={(scripts) =>
          scripts.map((src) => (
            <Script
              key={src}
              src={src}
              strategy="lazyOnload"
              onLoad={() => console.log(`Loaded: ${src}`)}
            />
          ))
        }
      />
      <h1>My Page Content</h1>
    </div>
  );
}

​
API Reference

​
Props

PropTypeDefaultDescription
remoteUrlstringRequiredThe URL to fetch script URLs from
cacheIntervalnumber300Cache duration in seconds
scriptAttributesScriptAttributesundefinedAttributes applied to every generated <script> tag. Must include data-code: YOUR_ACCOUNT_ID.
renderScriptfunctionundefinedCustom script rendering function

​
Types

type ScriptAttributeValue = string | boolean | number | undefined;

interface ScriptAttributes {
  [key: string]: ScriptAttributeValue;
}

interface ServerTagProps {
  remoteUrl: string;
  cacheInterval?: number;
  scriptAttributes?: ScriptAttributes;
  renderScript?: (scripts: string[]) => React.ReactNode;
}

​
Security

  • Only HTTP and HTTPS URLs are allowed
  • Server-side execution prevents client-side script injection
  • URL validation prevents malicious protocol usage

​
Browser Compatibility

This package works with all browsers supported by Next.js 15+ and React 19.