/* Hero — animated bypass diagram + live terminal */ const { useState, useEffect, useRef } = React; /* ---------- animated bypass diagram ---------- */ function BypassDiagram() { // Phase cycle (0..3) drives the packet animation: // 0 → request leaving app → step 1 active // 1 → unblocker pulses, hand-off → step 2 active // 2 → unblocker fires through wall → step 2 active // 3 → response returns to app → step 3 active const [phase, setPhase] = useState(0); const [paused, setPaused] = useState(false); useEffect(() => { if (paused) return; const id = setInterval(() => setPhase((p) => (p + 1) % 4), 1400); return () => clearInterval(id); }, [paused]); const activeStep = phase === 0 ? 1 : phase === 3 ? 3 : 2; return (
setPaused(true)} onMouseLeave={() => setPaused(false)} >
01 Request → 02 Bypass → 03 Clean HTML
); } /* ---------- live terminal ---------- */ const CODE_SAMPLES = { js: [ { t: "// 1 — call Unblocker, get any URL", cls: "c-c" }, { t: "const ", cls: "c-k" }, { t: "res", cls: "c-p" }, { t: " = " }, { t: "await ", cls: "c-k" }, { t: "makeStringUnblockerRequest", cls: "c-f" }, { t: "({" }, { t: "\n url: ", cls: "" }, { t: '"https://azure.microsoft.com/api/v3/pricing/…"', cls: "c-s" }, { t: "\n});" }, { t: "\n\n// 2 — done. that's it.", cls: "c-c" }, { t: "\nconsole.", cls: "" }, { t: "log", cls: "c-f" }, { t: "(", cls: "" }, { t: "res", cls: "c-p" }, { t: ".", cls: "" }, { t: "html", cls: "c-n" }, { t: ");" } ], py: [ { t: "# 1 — same endpoint, just python", cls: "c-c" }, { t: "\nimport ", cls: "c-k" }, { t: "unblocker", cls: "c-p" }, { t: "\n\nres ", cls: "" }, { t: "= ", cls: "c-k" }, { t: "unblocker.", cls: "" }, { t: "get", cls: "c-f" }, { t: "(", cls: "" }, { t: '\n url=' }, { t: '"https://walmart.com/ip/…"', cls: "c-s" }, { t: "\n)" }, { t: "\n\nprint", cls: "c-f" }, { t: "(res.", cls: "" }, { t: "html", cls: "c-n" }, { t: ")" } ], curl: [ { t: "# straight HTTP, anywhere", cls: "c-c" }, { t: "\ncurl ", cls: "c-f" }, { t: "https://api.usestring.ai/v1/unblock", cls: "c-s" }, { t: "\n -H ", cls: "" }, { t: '"Authorization: Bearer $STRING_KEY"', cls: "c-s" }, { t: "\n -d ", cls: "" }, { t: '\'{"url":"https://indeed.com/jobs?q=…"}\'', cls: "c-s" } ] }; const OUTPUT_LINES = [ { t: "→", cls: "c-dim" }, { t: " POST /v1/unblock", cls: "" }, { t: "\n← ", cls: "c-dim" }, { t: "200 OK", cls: "c-ok" }, { t: " ", cls: "" }, { t: "1.18s", cls: "c-dim" }, { t: " ", cls: "" }, { t: "178 KB", cls: "c-dim" }, { t: "\n status: ", cls: "c-dim" }, { t: '"unblocked"', cls: "c-s" }, { t: "\n defense: ", cls: "c-dim" }, { t: '"datadome"', cls: "c-s" }, { t: " ", cls: "" }, { t: "✓ bypassed", cls: "c-ok" }, { t: "\n html: ", cls: "c-dim" }, { t: '"…"', cls: "c-s" } ]; function CodeTerminal() { const [lang, setLang] = useState("js"); const [typed, setTyped] = useState(0); const [showOutput, setShowOutput] = useState(false); const [outputTyped, setOutputTyped] = useState(0); // Compute total chars for current sample const sample = CODE_SAMPLES[lang]; const fullText = sample.map(s => s.t).join(""); const outputFull = OUTPUT_LINES.map(s => s.t).join(""); useEffect(() => { setTyped(0); setShowOutput(false); setOutputTyped(0); }, [lang]); useEffect(() => { if (typed >= fullText.length) { const t = setTimeout(() => setShowOutput(true), 500); return () => clearTimeout(t); } const id = setTimeout(() => setTyped((n) => n + 1), 18); return () => clearTimeout(id); }, [typed, fullText.length]); useEffect(() => { if (!showOutput) return; if (outputTyped >= outputFull.length) { // restart after delay const t = setTimeout(() => { setTyped(0); setShowOutput(false); setOutputTyped(0); }, 3500); return () => clearTimeout(t); } const id = setTimeout(() => setOutputTyped((n) => n + 1), 8); return () => clearTimeout(id); }, [showOutput, outputTyped, outputFull.length]); // Render typed slice across segments const renderTyped = (segments, limit) => { let used = 0; return segments.map((seg, i) => { if (used >= limit) return null; const remaining = limit - used; const chunk = seg.t.slice(0, remaining); used += chunk.length; return {chunk}; }); }; return (
scrape.{lang === "py" ? "py" : lang === "curl" ? "sh" : "ts"} {showOutput ? ● live : ● ready}
{["js", "py", "curl"].map((k) => ( ))}
{renderTyped(sample, typed)} {typed < fullText.length && } {showOutput && ( <> {"\n\n"} ──────── output ──────── {"\n"} {renderTyped(OUTPUT_LINES, outputTyped)} {outputTyped < outputFull.length && } )}
); } /* ---------- the section ---------- */ function HeroSection() { return (
Q2 2026 benchmark · 97.1% success

Any page.
No matter who's guarding it.

String Unblocker bypasses Cloudflare, DataDome, Akamai & Kasada with one HTTP call. Pay only when we return content — no captchas, no false charges, no headless browser to babysit.

Pay per success Universal HTTP Native AI inference
{/* Sub-hero: terminal */}
The whole API

One call. Then your scraper just works.

The endpoint takes a URL and returns rendered HTML. Drop it in wherever you fetch. No proxy rotation, no browser farm, no anti-bot research.

  • → Same shape as the providers you already use — drop-in switch.
  • → Returns full rendered HTML, JS-executed.
  • → Optional structured-data extraction in-flight.
); } window.HeroSection = HeroSection; window.BypassDiagram = BypassDiagram; window.CodeTerminal = CodeTerminal;