Por que o navegador manda uma requisição OPTIONS antes de algumas das nossas chamadas de API, e como você impede que ela falhe?

Essa chamada OPTIONS é o preflight do CORS. Os navegadores mandam isso sempre que uma requisição cross origin não é simples, o que cobre qualquer header customizado, um content type JSON, ou um método diferente de GET, HEAD ou POST. O seu servidor precisa responder aquele OPTIONS com Access-Control-Allow-Origin, Allow-Methods e Allow-Headers que de fato cubram a requisição real, mais Allow-Credentials e uma origem concreta se houver cookies envolvidos.

O preflight é o navegador pedindo permissão antes de mandar qualquer coisa com efeito colateral. Um GET simples sem headers customizados é uma requisição simples e sai direto, mas no momento em que você adiciona um header Authorization ou manda application/json, você ganha o OPTIONS antes. Quando ele falha, eu checo três coisas em ordem: o servidor responde OPTIONS mesmo, o Access-Control-Allow-Headers lista todos os headers que a requisição real manda, e a origem está sendo ecoada exatamente, incluindo esquema e porta. O caso de credenciais pega as pessoas, porque se você manda cookies você não pode usar uma origem curinga; você tem que refletir uma origem específica permitida e colocar Access-Control-Allow-Credentials como true. Eu também configuro o Access-Control-Max-Age para o navegador parar de fazer preflight em toda chamada. O que eu garanto que um time entenda é que nada disso protege a API. Qualquer coisa que não seja um navegador ignora o CORS por completo, então a autorização continua tendo que ser imposta no servidor.