CORS error on browser requests: the fix.

Your page tried to read a response from another origin, and the browser did not find permission for your origin in the response headers. The request may have reached the server; the browser just refuses to hand the response to your JavaScript.

Both are built to be called from servers. The Steam Web API sends no Access-Control-Allow-Origin header and answers a preflight OPTIONS request with 405. The CS2 API only allows its own dashboard origins, on purpose: a key used in browser code is visible to every visitor.

• A custom header such as x-api-key makes the browser send a preflight OPTIONS request first.
• Steam: no CORS headers on any response, checked on 2026-10-03.
• CS2 API: CORS headers only for allow-listed origins. Your production site is not one of them, and should not need to be.

Add one server route that calls the API with the key from an environment variable and returns the JSON to your page. Your browser code calls your own origin, so there is no cross-origin request and no exposed key.

const ALLOWED = /^(matches\/(live|upcoming|results)|teams\/rankings)$/

export async function GET(req: Request, { params }: { params: Promise<{ path: string[] }> }) {
  const path = (await params).path.join("/")
  if (!ALLOWED.test(path)) return Response.json({ error: "not allowed" }, { status: 404 })

  const search = new URL(req.url).search
  const upstream = await fetch(`https://api.citoapi.com/api/v1/cs2/${path}${search}`, {
    headers: { "x-api-key": process.env.CITO_API_KEY! },
    next: { revalidate: 15 }, // share one upstream call per 15 s across visitors
  })
  return new Response(upstream.body, {
    status: upstream.status,
    headers: { "content-type": "application/json" },
  })
}

// Browser: fetch("/api/cs2/matches/live").then((r) => r.json())

export default {
  async fetch(req, env) {
    const url = new URL(req.url)
    if (!url.pathname.startsWith("/cs2/")) return new Response("not found", { status: 404 })
    const upstream = await fetch("https://api.citoapi.com/api/v1" + url.pathname + url.search, {
      headers: { "x-api-key": env.CITO_API_KEY },
      cf: { cacheTtl: 15, cacheEverything: true },
    })
    const res = new Response(upstream.body, upstream)
    res.headers.set("Access-Control-Allow-Origin", "https://your-site.com")
    return res
  },
}

Allowing your origin would still put the key in every visitor's browser, where anyone can copy it and spend your quota. Public CORS proxies see your key and your traffic. A proxy you own fixes both, and its cache cuts the requests you are billed for.

By design the key never reaches a browser, so there is nothing for a visitor to steal: put one small proxy between your page and the API and the CORS error cannot occur. Responses are plain JSON that is safe to cache at that proxy, which also keeps your request count down.