Fetch 请求不允许使用 DELETE 方法 - CORS

Question

我之前在另一个请求中遇到过这个问题，但它有点自行修复了。现在我在删除请求时遇到了同样的问题，但是没有任何效果。我试过设置 'mode: cors'，我试过允许所有来源甚至特定主机名。似乎没有任何效果。

控制台错误： console log error screenshot

我模块中的 Fetch：

async function deleteProject(_id: string) {
    try {
      const response = await fetch(urlDelete + _id, {
        method: 'DELETE',
        headers: {
          Accept: 'application/json',
          'auth-token': token as string,
        }
      });

      if (!response.ok) {
        throw new Error(`Error! status: ${response.status}`);
      }

      const result = (await response.json()) as GetProjectResponse;
      // @ts-expect-error: Unreachable code error
      state.Project = result;
      return result;
    } catch (error) {
      if (error instanceof Error) {
        console.log('error message: ', error.message);
        return error.message;
      } else {
        console.log('unexpected error: ', error);
        return 'An unexpected error occurred';
      }
    }
  }

我的后台路由：

router.delete("/delete/:id", verifyToken, (req, res) => {
    const id = req.params.id;
    project.findByIdAndDelete(id)
    .then(data => {
        if (!data) {
            res.status(404).send({ message: "Cannot delete project with id: " + id});
        } else {
            res.send({ message: "Project was deleted."})
        }
    })
    .catch(err => { res.status(500).send({ message: "Error deleting project with id: " + id }); })
});

Answer 1

您可以尝试在浏览器的开发工具中执行您的代码。这基本上将有助于更好地理解问题。在这种情况下我更喜欢使用 Firefox，它可以让您更清楚地了解问题。另外我注意到，在 Google Chrome 开发工具中不可能执行 CORS 请求，而在 Firefox

中可以执行相同的代码

Answer 2

好的，所以我检查了我的后端，在合并后我丢失了一些 headers，所以我不得不专门为 cors 声明所有选项。谢谢大家的意见。

Fetch 请求不允许使用 DELETE 方法 - CORS

Method DELETE not allowed on Fetch request - CORS

fetch

cors

typescript