Practice Questions

Interview answer drill

Use this JavaScript interview question to rehearse a quick answer, common mistake, follow-up, and production pitfall.

Practice more JavaScript interview questions Follow JavaScript mastery study plan Open Essential 60

How would you securely handle CORS issues in a frontend application?Frontend interview answer

HighIntermediateJavascript

By FrontendAtlas Team · Updated Apr 4, 2026

Interview focus

This JavaScript interview question tests whether you can explain Secure CORS handling in production: server policy, preflight debug, and BFF patterns, connect it to production trade-offs, and handle common follow-up questions.

Secure CORS handling in production: server policy, preflight debug, and BFF patterns explanation without falling back to memorized docs wording
Cors and Security reasoning, edge cases, and production failure modes
How you would answer the most likely JavaScript interview follow-up

Practice more JavaScript interview questions

Interview quick answer

Secure CORS handling is mostly a server-policy and preflight debugging problem, not a frontend workaround. The production-safe fixes are trusted origin allowlists, correct headers, and a BFF or proxy when direct browser access is the wrong architecture.

Full interview answer

Security model

CORS is a browser-enforced boundary, so the frontend cannot bypass it. Real fixes are about server policy and preflight debug: allow the right origins, methods, and headers, or move calls behind a BFF/proxy when direct browser access is the wrong production architecture.

Frontend action	What it does (and doesn’t do)
Use same-origin URLs (call your own domain)	Avoids CORS entirely if the API is served from the same origin.
Remove custom headers / use simple requests	May avoid preflight, but still won’t bypass CORS if the server disallows the origin.
Set `credentials: 'include'`	Sends cookies, but requires server to allow credentials and a specific origin.
Use `mode: 'no-cors'`	Does not fix CORS; response becomes opaque and unusable.

What the frontend can and cannot control

Header	Purpose
`Access-Control-Allow-Origin`	Allow only trusted origins (never use `*` with credentials).
`Access-Control-Allow-Methods`	Explicitly list allowed methods (GET, POST, etc.).
`Access-Control-Allow-Headers`	Allow only required headers (e.g., Authorization, Content-Type).
`Access-Control-Allow-Credentials`	Needed for cookies; requires a specific origin (not `*`).
`Access-Control-Max-Age`	Cache preflight responses to reduce latency.
`Vary: Origin`	Prevents caches from mixing responses across origins.

Core CORS headers you should understand

Preflight (OPTIONS) requests

Browsers send a preflight when a request is not “simple” (custom headers, non-GET/POST, or JSON content type). Your server must respond to OPTIONS with the same CORS headers or the real request will be blocked.

JAVASCRIPT

// Express example (server-side)
app.use((req, res, next) => {
  const allowed = ['https://app.example.com'];
  const origin = req.headers.origin || '';

  if (allowed.includes(origin)) {
    res.setHeader('Access-Control-Allow-Origin', origin);
    res.setHeader('Vary', 'Origin');
    res.setHeader('Access-Control-Allow-Credentials', 'true');
  }

  res.setHeader('Access-Control-Allow-Methods', 'GET,POST,PUT,DELETE');
  res.setHeader('Access-Control-Allow-Headers', 'Content-Type, Authorization');

  if (req.method === 'OPTIONS') return res.sendStatus(204);
  next();
});

When you can’t change the API

Use a backend proxy/BFF: your frontend calls your own server, and your server calls the third-party API. This avoids CORS, keeps API keys private, and lets you enforce auth, logging, and rate limits.

Avoid these

Disabling CORS in the browser or using extensions (not a real fix).

Using mode: 'no-cors' (opaque responses you cannot read).

Setting Access-Control-Allow-Origin: * with credentials.

Interview-ready answer

You don’t “fix CORS” in the frontend; you configure the API (or a proxy/BFF) to allow trusted origins with the right CORS headers, handle preflight correctly, and avoid wildcard origins when credentials are involved.