POST请求遭CORS策略拦截，配置后仍无法解决求助

1. 移除前端请求中的Access-Control-Allow-Origin头 #

这个响应头只能由服务端设置，前端请求里添加完全无效，还可能干扰正常逻辑。修改你的addComment函数：

export const addComment = async (comment) => {
  const options = {
    method: 'POST',
    headers: {
      "Accept": "application/json",
      "Content-Type": "application/json"
      // 删除这一行："Access-Control-Allow-Origin": "*"
    },
    body: JSON.stringify(comment)
  };

  try {
    const response = await fetch(URL + '/feedback-detail/comment', options);
    // 注意：response.json()是异步操作，必须加await
    const data = await response.json();
    return data;
  } catch (error) {
    throw new Error('Error submitting comment')
  }
}

2. 确保服务端CORS中间件加载顺序正确 #

CORS中间件必须在所有路由之前注册，否则路由处理请求时不会应用CORS配置。检查服务端入口文件：

const Koa = require('koa');
const cors = require('@koa/cors');
const router = require('./your-router-path');

const app = new Koa();

// 先加载CORS中间件
app.use(cors({ origin: 'http://localhost:3000' }));
// 再加载路由
app.use(router.routes()).use(router.allowedMethods());

app.listen(3030);

如果/feedback-detail/comment路由在CORS中间件之后加载，而正常的addRequest路由在之前，就会出现接口表现不一致的情况。

3. 确保错误响应也携带CORS头 #

当控制器抛出500错误时，要保证CORS头能正常返回。可以添加错误处理中间件兜底：

app.use(cors({ origin: 'http://localhost:3000' }));

// 错误处理中间件
app.use(async (ctx, next) => {
  try {
    await next();
  } catch (err) {
    ctx.status = err.status || 500;
    ctx.body = { message: err.message };
    // 手动设置CORS头（防止中间件未自动处理）
    ctx.set('Access-Control-Allow-Origin', 'http://localhost:3000');
  }
});

app.use(router.routes());

4. 验证服务端响应头 #

打开浏览器开发者工具的「Network」标签，找到/feedback-detail/comment请求，查看「Response Headers」中是否存在Access-Control-Allow-Origin: http://localhost:3000。如果没有，说明CORS中间件未生效，回到步骤2检查加载顺序。

5. 排查数据库操作的潜在错误 #

模型层的数据库查询如果抛出未捕获错误，可能导致CORS头无法正常添加。给模型层添加错误捕获：

exports.postComment = async (comment) => {
  try {
    const sql = 'INSERT INTO comments (request_id, comment_id, content, username, name, image, replying_to) VALUES ($1, $2, $3, $4, $5, $6, $7)';
    const values = [comment.id, comment.comment_id, comment.content, comment.username, comment.name, comment.image, comment.replying_to];
    return await pool.query(sql, values);
  } catch (err) {
    console.error('Database error:', err);
    throw err;
  }
}

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