HTTP Header Inspector Badge

WHAT IT DOES

HTTP Header Inspector Badge captures and displays HTTP headers from any webpage, giving you instant visibility into the request and response headers exchanged between the browser and the server. The extension intercepts fetch() and XMLHttpRequest calls made by the page, capturing response headers including Content-Type, Cache-Control, Server, Set-Cookie, and many others. A security summary shows the presence of critical security headers like Content-Security-Policy (CSP), HSTS, X-Frame-Options, X-Content-Type-Options, and Referrer-Policy, with clear status indicators for each. The panel displays headers in an organized, readable format with separate sections for each captured request. You can copy all headers to your clipboard, toggle between response and request headers, and refresh the view to capture new requests. A compact badge shows the number of captured requests and security header status at a glance.

WHERE IT RUNS

The extension works on every website that makes fetch or XMLHttpRequest calls, including complex single-page applications, traditional websites, and any page with network activity. It runs locally in your browser, intercepting network requests at the JavaScript level without sending any data to external servers. The extension supports all major browsers and adapts to both desktop and mobile viewports seamlessly.

HOW TO USE

After installation, a "📡 Headers" badge appears in the bottom-right corner showing the number of captured requests and security header count. Click the badge to open the Headers Inspector panel. The panel displays all captured requests with their response headers. For each request, you can see the method, URL, and all response headers. Click "Refresh" to re-capture headers from the page. Click "Copy" to copy all headers to your clipboard. Use "Security" to toggle the security summary view. Use "Request" to show or hide request headers. Use "Compact" for a more condensed view. To customize the experience, open the extension panel and toggle "Auto-capture on page load" to enable or disable automatic header capture. For per-site customization, enable or disable the extension on specific websites using the per-site controls.

THE ACTUAL MECHANISM — FETCH AND XMLHTTPREQUEST INTERCEPTION WITH HEADER EXTRACTION

The extension uses two interception strategies. For fetch(), it replaces the global window.fetch with a wrapper that calls the original fetch and then captures response headers from the Response object using clone() and the headers.forEach() method. For XMLHttpRequest, it intercepts the open and send methods, storing the method and URL during open, and capturing response headers during the onreadystatechange handler when readyState reaches 4 (complete), using getAllResponseHeaders(). Both interceptors store captured headers in a global array with the request URL, method, and a parsed header object. The security header check scans for a predefined list of security headers: Content-Security-Policy, Strict-Transport-Security, X-Frame-Options, X-Content-Type-Options, X-XSS-Protection, Referrer-Policy, Permissions-Policy, and Access-Control-Allow-Origin. Each security header is marked as present or missing, with a summary displayed at the top of the panel. The panel renders headers as key-value pairs with syntax highlighting for readability.

THE PANEL

The settings panel is a lightweight, draggable overlay that appears in the center of your screen. You can reposition it by clicking and dragging the title bar; release it near the screen edge and it will snap into place automatically. To collapse the panel into a compact title bar, click the minimize button, expanding it again with the same control. The panel is fully responsive, adapting to different screen resolutions with a minimum width of 300px and a maximum of 480px. Press the Escape key at any time to dismiss the panel without applying changes. All controls—the enable/disable toggle, show headers button, close button, refresh button, copy button, security toggle, request toggle, compact toggle, auto-capture toggle, and per-site controls—are accessible within a clean, high-contrast interface that respects your system's color scheme.

PLEASE NOTE

This extension requires the free BotGentz companion extension to be installed and active, which provides the underlying DOM access, clipboard, and storage engine. The interception works at the JavaScript level and may not capture all network requests, particularly those made via service workers, iframes, or the browser's native navigation. The extension does not capture headers from the initial page load—use the HEAD request fallback in the "Refresh" button to capture them. Some headers may be restricted by CORS policies and may not be accessible from JavaScript. No personal data, browsing history, or network data is ever collected, stored, or transmitted. All settings are saved using the browser's storage API and remain solely on your device. The extension does not inject ads, trackers, or analytics of any kind.