预检请求未通过访问控制检查：它没有 HTTP ok 状态问题，我不知道为啥，我正确导入了所有内容

Posted 2023-03-11

【中文标题】预检请求未通过访问控制检查：它没有 HTTP ok 状态问题，我不知道为啥，我正确导入了所有内容

【英文标题】：Preflight request doesn't pass access control check: It does not have HTTP ok status problem and i don't know why, i imported everything right预检请求未通过访问控制检查：它没有 HTTP ok 状态问题，我不知道为什么，我正确导入了所有内容

【发布时间】：2021-08-23 20:50:00

【问题描述】：

我收到此错误消息，其中显示“对预检请求的响应未通过访问控制检查：它没有 HTTP ok 状态。”有人知道它是什么吗？

这是我在后端的代码：

app.js

app.delete("api/posts/:id", (req,res,next) =>
  console.log(req.params.id);
  res.status(200).json(message: 'post deleted!')
)

这是前端的代码：

posts.service.ts：

deletePost(postId: string) 
    this.http
      .delete('http://localhost:3000/api/posts/' + postId)
      .subscribe(() => 
        console.log('deleted');
      );
  

post-list.component.ts

onDelete(postId: string) 
    this.postsService.deletePost(postId);
  

还有post-list.component.html：

<button mat-button color="warn" (click)="onDelete(post.id)">DELETE</button>

请注意，我的代码中允许使用 CORS，这是证明：

app.use((req, res, next) => 
  res.setHeader("Access-Control-Allow-Origin", "*");
  res.setHeader(
    "Access-Control-Allow-Headers",
    "Origin, X-Requested-With, Content-Type, Accept"
  );
  res.setHeader(
    "Access-Control-Allow-Methods",
    "GET, POST, PATCH, PUT, DELETE, OPTIONS"
  );
  next();
);

这是问题的图片：

【问题讨论】：

在浏览器中检查标题是否确实存在于 OPTIONS 响应中..

【参考方案1】：

预检请求不作为“正常”请求处理。它们具有 http OPTIONS 标头。因此，在您设置 CORS 标头的代码 sn-p 之后，只需添加以下行：

app.options('/*', (_, res) => 
    res.sendStatus(200);
);

这只是将状态设置为 200，应该可以解决您的问题。

【讨论】：

仍然，我在删除时找不到 404 的问题.. 任何想法如何解决这个问题？顺便说一句，这个已经解决了，谢谢！

这个错误在哪里提到？没找到

在那个下面，这里：prnt.sc/14dugss

看看这里：***.com/a/33490521/4102907@MilošMilutinov Milutinov