Node.js Express.js jQuery Ajax POST报错 已到后端仍触发error

• 故障和res.send()逻辑完全无关，本质是跨域资源共享（CORS）策略拦截了响应。
• 你在Ajax请求中直接写了完整后端地址http://localhost:1337/xxx，说明前端页面的访问地址和后端不在同一源（比如是直接打开本地html的file://协议，或是跑在其他端口的服务上），浏览器默认会拦截未携带CORS放行头的跨域响应——哪怕后端已经正常执行完路由逻辑、把响应发回给浏览器，前端JS也无法读取响应内容，直接触发error回调。
• 你之前觉得/prueba路由运行正常，是因为对应Ajax请求没有配置success/error回调，哪怕响应被拦截也不会有日志输出，完全感知不到异常。

打开浏览器开发者工具的「网络」面板，点击「GET TEXT」按钮找到/getText对应的请求，可看到响应头中缺少Access-Control-Allow-Origin字段，控制台会明确输出跨域拦截的具体报错。

方案1：同源部署（零额外配置） #

将前端页面和后端服务放到同一域名/端口下，彻底规避跨域限制：

1. 新建public文件夹，把index.html移入该目录
2. 在app.js中添加静态资源托管逻辑：

app.use(express.static('public'));

3. 不要直接双击打开本地html文件，通过http://localhost:1337/index.html访问前端页面，此时Ajax请求和后端同源，可正常触发success回调。

方案2：保留跨域部署，后端放行跨域请求 #

如果前后端确实需要运行在不同端口/域名，在所有路由之前添加自定义中间件，给响应加上CORS放行头：

// 这段代码必须放在所有app.post()路由定义之前
app.use((req, res, next) => {
  // 开发阶段可直接用*允许所有来源，生产环境替换为实际的前端域名
  res.header("Access-Control-Allow-Origin", "*");
  res.header("Access-Control-Allow-Headers", "Content-Type");
  next();
});

添加完成后不需要修改原有/getText路由的逻辑，res.send("Hola mundo")返回的内容就能被success回调正常接收。

内容的提问来源于stack exchange，提问作者Program Onicom