When does fetch trigger a CORS preflight, and what POST is complex?

WHAT THIS TESTS: Whether you know the exact conditions that promote a cross-origin fetch from a simple request to a complex one requiring an OPTIONS preflight. Interviewers care because misconfigured CORS is a common production outage, and senior engineers should know the difference between a same-origin policy restriction and a preflight handshake. The question also checks if you can articulate a concrete counter-example rather than only reciting abstract rules, and whether you understand that the browser not the server initiates the OPTIONS check.

A GOOD ANSWER COVERS: First, state that preflights only happen on cross-origin requests because same-origin fetches never send OPTIONS for CORS. Second, explain that a request is simple when it uses GET, HEAD, or POST with only CORS-safelisted request headers and a body whose Content-Type is one of text/plain, application/x-www-form-urlencoded, or multipart/form-data. Third, note that any deviation triggers preflight, such as methods like PUT or DELETE, custom headers such as Authorization or X-API-Version, or a POST with Content-Type application/json. Fourth, describe the preflight mechanism itself: the browser sends an OPTIONS request carrying Access-Control-Request-Method and Access-Control-Request-Headers so the server can respond with appropriate Access-Control-Allow headers before the real request is attempted.

COMMON WRONG ANSWERS: Saying that all POST requests require a preflight, or that preflights are sent for same-origin requests. Another red flag is blaming CORS entirely on the server without acknowledging that the browser enforces the policy; the server does not initiate the OPTIONS request, the browser does. Claiming that including cookies or credentials always forces a preflight is also incorrect; credentials affect whether the browser blocks the response, not whether an OPTIONS request occurs. Finally, confusing the preflight OPTIONS call with the actual request method is a signal of weak HTTP fundamentals.

LIKELY FOLLOW-UPS: How would you handle a preflight failure in a production API? What is the impact of custom headers on caching? Can you avoid a preflight for a JSON POST, and should you? How do redirects interact with preflighted requests? What happens if the preflight response is cached by an intermediary?

ONE CONCRETE EXAMPLE: Imagine a React app on https://app.example.com calling fetch with method POST, url https://api.other.com/events, headers including Content-Type application/json and Authorization Bearer token, and body JSON.stringify({event: click}). Because the Content-Type is not one of the three simple values and Authorization is a custom header, the browser first sends OPTIONS /events with Access-Control-Request-Method: POST and Access-Control-Request-Headers: content-type, authorization. Only if the server returns 204 with Access-Control-Allow-Origin: https://app.example.com and Access-Control-Allow-Headers: content-type, authorization does the browser proceed with the actual POST.

Source: developer.mozilla.org