Rankato

Open Graph Debugger — deep diagnostics for broken share cards

Not a previewer — a diagnostician. Fetch as every major bot, follow every redirect, validate every image, and get a copy-paste fix for every finding.

Server-side fetch 7 bot UAs 9 platforms
Deep OG diagnostics

Find out why
your share card is broken.

The debugger fetches your URL as a browser AND as every major crawler, chases the redirect chain, validates the image, and diffs OG against JSON-LD. Everything a broken preview could be, in one report.

  • Bot UA testing

    Re-fetches with Facebook, Twitter, LinkedIn, Slack, Discord, WhatsApp, Telegram bots — catches UA-based cloaking.

  • Redirect + header trace

    Every hop with status codes, plus Cache-Control, X-Robots-Tag, and TTFB.

  • JSON-LD ↔ OG diff

    Flags mismatches between schema.org fields and Open Graph tags.

Sample diagnosis
og:image → 800×418
Slack diff: title differs from browser
JSON-LD headline ≠ og:title
Facebook Sharing Debugger →

The Open Graph Debugger is a deep-diagnostics tool for anyone whose Facebook / LinkedIn / X / Slack / Discord / WhatsApp share cards look wrong. Unlike a simple previewer, it stress-tests your URL from every angle a crawler might see it. It re-fetches the page with the actual user-agent strings that facebookexternalhit, Twitterbot, LinkedInBot, Slackbot, Discordbot, WhatsApp and TelegramBot send — so you catch UA-based cloaking, Cloudflare bot-blocking, and firewall rules that silently break previews. It follows the entire redirect chain hop-by-hop with status codes, TTFB and response headers (Cache-Control, X-Robots-Tag, Content-Type). It downloads the og:image and twitter:image, parses dimensions natively (PNG / JPEG / GIF / WebP / SVG — no PIL required), verifies HTTPS, and warns on anything under 200×200 (Facebook won't render it), off-ratio (target 1.91:1), or over 8 MB. It extracts every <script type="application/ld+json"> block and diffs the schema.org headline / description / image fields against your Open Graph tags — a mismatch typically means Google shows one snippet and Facebook shows another. It heuristically detects SPAs where the OG tags only appear after JavaScript runs (most scrapers don't execute JS, so the card silently fails). And it gives you a copy-paste-ready <meta> block that fills in what's missing, with one-click links to Facebook's Sharing Debugger, LinkedIn Post Inspector, and Twitter Card Validator to force a re-scrape after you deploy the fix. Bulk mode debugs up to 10 URLs at once (Pro plan). Everything server-side, SSRF-guarded, and safe on private URLs.

Preview vs debugger — which do you need?

A share-card previewer renders what your card should look like based on inputs you give it. A debugger tells you why the real card is broken. If your share card looks fine, use the preview tool. If it looks wrong in one place (say the Facebook image is missing but Slack unfurls fine), that's a debugger job — every platform's crawler behaves slightly differently and the only way to catch these bugs is to fetch the URL the way each crawler does. This tool re-fetches your page with the exact User-Agent strings facebookexternalhit/1.1, Twitterbot/1.0, LinkedInBot/1.0, Slackbot-LinkExpanding 1.0, Discordbot/2.0, WhatsApp/2.23 and TelegramBot send, then diffs the response against what a browser sees. If Cloudflare returns 403 to Facebook but 200 to your browser, that's the bug — and the debugger surfaces it in seconds.

What breaks Open Graph in production

In our audit data, roughly 60% of broken share cards trace to one of five root causes. 1. Missing og:image — the single most common bug; platforms fall back to a random image on the page (often a logo or ad). 2. og:image too small — anything under 200×200 kills the Facebook preview entirely; anything under 600×315 downgrades to the low-CTR side-image card. 3. og:image over HTTP — Facebook, Slack, and iMessage silently drop insecure images. 4. Bot-blocking / cloaking — Cloudflare bot fight mode, WAF rules, or JS challenges that return 403 or JS challenges to crawler UAs. 5. SPA rendering — OG tags injected via React / Vue / Angular after mount; most scrapers don't execute JS so they see an empty <head>. The debugger checks all five in one run and tells you which is your problem.

The redirect trap

Redirect chains are the invisible killer of share previews. When someone shares example.com/blog/my-post and that 301s to www.example.com/blog/my-post/, some scrapers (notably Slack) follow the redirect and read OG from the final URL, but others (older WhatsApp, some RSS readers) stop at the first hop and get whatever meta tags the redirecting page returns — usually nothing. The debugger traces the entire chain (up to 8 hops), reports every status code and TTFB, and flags dangerous patterns: HTTPS→HTTP downgrades, mixed www / naked-domain flips, chains of 3+ hops (Google drops after ~10), 302 temporary redirects where you meant 301 permanent, and terminal 4xx/5xx errors. If your card works in Slack but not WhatsApp, the redirect chain is where you look first.

Image validation without PIL

The image analyzer downloads the og:image and twitter:image and reads dimensions directly from the raw bytes — no image-processing library required. It parses PNG IHDR chunks, JPEG SOF markers (SOF0 through SOF15), GIF logical-screen dimensions, WebP VP8 / VP8L / VP8X headers, and SVG width/height attributes. For each image we report: exact dimensions, aspect ratio to 3 decimals, byte count, MIME type, HTTPS status, and HTTP response code. Then we cross-check against the ideal for each platform: Facebook large card — 1200×630 at 1.91:1, minimum 200×200, max 8 MB, PNG or JPG; Twitter summary_large_image — 1200×628, minimum 300×157, max 5 MB; WhatsApp — minimum 300×300 or the preview breaks silently. Any deviation shows up as a warning with the exact numbers.

OG vs JSON-LD consistency

Modern pages carry two overlapping metadata layers: og:* for social platforms and <script type="application/ld+json"> for Google's rich results. When they disagree, you get inconsistent branding — Google shows one headline in its SERP, Facebook shows another in the feed, and users lose trust because the click-through page doesn't match either. The debugger extracts every JSON-LD block (including @graph containers), collects headline / name / description / image from every Article, Product, WebPage, and Organization entity, and diffs them against your Open Graph tags. The output tells you exactly which fields match, which mismatch, and gives you the offending values side by side so you can pick which one wins.

Force re-scrape after the fix

Fixing your tags does nothing until every platform's cache expires — which can take a week. Every major platform provides a scraper endpoint you can hit to force an immediate re-scrape: Facebook at developers.facebook.com/tools/debug, LinkedIn at linkedin.com/post-inspector, Twitter at cards-dev.twitter.com/validator, and Pinterest at developers.pinterest.com/tools/url-debugger. The debugger surfaces one-click links to all four with your URL pre-filled, so after you deploy the fix you can invalidate every cache in under a minute. For Slack and Discord, the trick is different: append a cache-busting query string (?v=2) to the shared URL and paste it fresh — those platforms don't have a public debugger but a new URL is always re-scraped.

Tool FAQs

Everything you need to know about using Open Graph Debugger.

How is this different from the Open Graph Preview tool?+

Different job. The preview tool renders share cards from inputs you give it — great for designing new pages or checking staged HTML. The debugger fetches a live URL from the server side using multiple crawler user-agents, follows redirects, validates images, and reports every reason a real-world share card might be broken. Use the preview when the card looks fine and you're building; use the debugger when something's already broken and you don't know why.

What does 'bot user-agent test' actually check?+

Some sites — usually via Cloudflare, AWS WAF, or a JS challenge — return different HTML to bots than to browsers. Facebook, Twitter, LinkedIn, Slack, Discord, WhatsApp and Telegram each identify themselves with a distinctive User-Agent string. If your origin returns 403 to Facebook's crawler but 200 to your Chrome browser, your Facebook share card is broken and no amount of tag-fixing will help — the platform never sees your HTML. This test re-fetches your URL with each crawler's exact UA string, then diffs the responses against a browser fetch to catch this class of bug. If any bot gets a different status code or different tag values, it's flagged as a finding.

Why does my image show 'dimensions unknown'?+

The dimension probe recognizes PNG, JPEG, GIF, WebP (all three VP8 variants), and SVG. If your image is in a format outside that list — AVIF, HEIC, TIFF, ICO — it's still downloaded and its byte size is checked, but width/height comes back as unknown. In practice this is rare because Facebook and LinkedIn don't reliably render AVIF anyway; if you're serving AVIF as your og:image, add a JPEG fallback: browsers respect <picture> but scrapers only read the raw og:image URL, so make that URL a JPG.

What is the SPA / JS-render check?+

Single-page apps (React, Vue, Angular, Next.js in client-only mode) often inject meta tags at runtime via document.head.appendChild. That works for browsers — but social platform crawlers don't execute JavaScript. They fetch the raw HTML and stop. Result: the crawler sees your empty shell and returns a text-only card with the page title (if you're lucky) or nothing (if you're not). The SPA check runs a heuristic — small body text length + zero OG tags in the raw HTML — and warns you if your page fits the pattern. Fix: render OG tags server-side (Next.js metadata API, SvelteKit +page.ts, Nuxt useHead), never client-side.

Can I debug URLs that are behind login or on staging?+

Not directly — the debugger fetches URLs from our server, so it can only see what's publicly reachable. For staged URLs, either put your staging domain behind a temporary path-based whitelist (example-staging.com/preview/xxx) or use our sister Open Graph Preview tool in Paste HTML mode, which parses in your browser without any server fetch. We SSRF-guard every fetch, so private IPs, localhost, cloud-metadata endpoints and file:// URLs are always blocked.

How does bulk mode work and why is it Pro-only?+

Bulk mode debugs up to 10 URLs in one run — useful for auditing a section of your site (10 top blog posts, 10 landing pages, 10 product pages) in one pass. It runs all URLs in parallel, so 10 URLs typically returns in under 15 seconds. The output is a table with score, error count, and warning count per URL, so you can spot which pages need fixing first. It's Pro-only because each debug run makes up to 9 outbound HTTP requests per URL (1 browser fetch, 7 bot fetches, 1 image fetch) — that's up to 90 requests for a 10-URL bulk run, and running that at anonymous scale would be trivially abusable.

Does the debugger execute JavaScript?+

No. It sends HTTP requests and parses the raw HTML response, matching the behavior of every real-world social crawler (which also don't execute JS). If your OG tags require JS to appear, they will not appear in this tool's report either — which is the point. Getting a bad result here is a signal that your real share cards are also broken; the fix is to render meta tags server-side, not to add JS execution to the debugger.