Axios向Django接口发起请求时出现OPTIONS替代POST问题求助

OPTIONS请求是跨域场景下浏览器自动发起的预检请求，本身属于正常行为。你遇到的问题核心来自前端Axios请求的配置错误：

• Axios的请求配置中，请求头的配置键为复数headers，你的代码里写成了单数header，导致自定义的Content-Type: application/json没有生效，预检请求完成后后续POST请求无法正常发起，直接断连出现Broken pipe报错。

async save() {
  let data = {
    "name": this.name,
    "title": this.title,
  }
  let config = {
    // 将单数header改为复数headers
    headers : {
      "Content-Type": "application/json",
    }
  }   
  // 补充response的变量声明，避免全局变量污染
  const response = await axios.post(
    'http://127.0.0.1:8000/save/',
    data,
    config
  )
}

如果修改后仍有异常，可按以下顺序排查：

• 给请求包裹try/catch块，捕获前端控制台的具体报错信息，确认是否有其他参数异常
• 确认请求路径末尾的斜杠和后端路由配置完全一致，Django默认开启APPEND_SLASH校验，路径不匹配会触发301重定向，导致POST请求异常
• 检查是否配置了全局Axios拦截器，是否存在拦截器篡改请求头、请求地址的逻辑

内容的提问来源于stack exchange，提问作者Henrique Andrade