触发CORS跨域拦截报错但POST请求仍执行成功的原因是什么

核心结论先明确：CORS是浏览器独有的端侧安全机制，它不拦截请求的发送，只拦截前端JS对跨域响应的读取权限。

跨域请求的完整执行逻辑 #

• 对于符合「简单请求」规则的跨域请求（你这次的POST删除请求就属于这类，通常满足请求方法是GET/POST/HEAD，且Content-Type属于text/plain、application/x-www-form-urlencoded、multipart/form-data三者之一，没有自定义特殊请求头），浏览器会直接把请求完整发送到目标服务端，不会做任何拦截。
• 你的Node服务收到请求后，会按照正常逻辑走完所有流程：解析请求参数、连接数据库执行删除操作、生成响应返回给浏览器，这一整套流程和同域请求没有任何差别，所以你指定ID的数据会被正常删掉。
• 等响应回到浏览器后，浏览器才会做CORS校验：检查响应头里的Access-Control-Allow-Origin等CORS配置是否匹配当前发起请求的页面源。如果不匹配，浏览器会直接把响应内容扣下，不交付给你写的前端JS代码，同时在控制台抛出你看到的CORS拦截报错——这时候你的JS拿不到响应状态、响应体等任何返回信息，但服务端的操作早就执行完了。

特殊情况说明 #

如果你的请求不属于简单请求（比如POST请求用了application/json格式传参、带了自定义鉴权请求头），浏览器会先发送一个OPTIONS方法的预检请求，确认服务端允许跨域之后才会发真正的业务请求。这种情况下如果服务端没返回正确的CORS头，浏览器会拦截后续正式请求的发送，服务端就不会执行对应操作。

常见误区提醒 #

CORS本质是保护浏览器端用户的数据安全，避免恶意网页偷偷读取用户在其他站点的隐私数据（比如你登录了邮箱，恶意网页跨域请求邮箱接口读你的邮件内容，这时候CORS会拦截JS拿到响应），它从来不是用来保护服务端接口不被调用的。
如果要避免接口被未授权调用执行删除、修改这类危险操作，必须在服务端层做鉴权校验（比如校验用户身份token、校验请求签名），靠CORS完全挡不住这类操作。

内容的提问来源于stack exchange，提问作者Saranya Maity