使用 fetch api 调用带有 keepalive 的 POST 请求时，预检请求失败

Posted 2023-02-27

【中文标题】使用 fetch api 调用带有 keepalive 的 POST 请求时，预检请求失败

【英文标题】：Preflight request failing on calling a POST request with keepalive using fetch api

【发布时间】：2019-09-08 07:15:23

【问题描述】：

我在使用启用了keepalive 的获取API 调用POST 请求时收到错误Preflight request for request with keepalive specified is currently not supported。任何帮助，将不胜感激 。我在 beforeunload 事件上调用这个 api。

API 请求

  fetch(uri, 
    method: 'POST',
    headers: 
      'Content-type': options.headers.get('content-type'),
      'Authorization': options.headers.get('authorization')
    ,
    body: JSON.stringify(interactionBody),
    keepalive: true
  ).catch((e) => 
    console.log(e);
  );

【问题讨论】：

bugs.chromium.org/p/chromium/issues/detail?id=835821

【参考方案1】：

在the Chrome issue fixed之前我找到了解决方法

使用mode: 'same-origin' 时可以正常工作

fetch(uri, 
  method: 'POST',
  headers: 
    'Content-type': options.headers.get('content-type'),
    'Authorization': options.headers.get('authorization')
  ,
  body: JSON.stringify(interactionBody),
  mode: 'same-origin',
  keepalive: true
)