Firebase可调用函数出现CORS预请求重定向无效错误求助

我之前在React+Firebase Hosting项目里也碰到过几乎一模一样的问题，折腾了好一会儿才找到根源，咱们来一步步拆解可能的原因和解决办法：

可能的原因&对应的解决方案 #

1. 云函数的部署状态或路径有误 #

首先最容易排查的就是函数本身有没有正确部署：

• 打开终端运行 firebase functions:list，查看已部署的函数列表，确认secondAddMessage存在，并且区域是us-central1（和你调用的URL区域一致）
• 如果函数不存在，重新部署：firebase deploy --only functions:secondAddMessage，注意如果部署时指定了区域，要确保和调用时的URL匹配，比如firebase deploy --only functions:secondAddMessage --region us-central1
• 刚部署完的函数可能需要等2-5分钟才能完全生效，别着急立刻测试

2. Firebase Hosting的重写规则干扰了请求 #

如果你的firebase.json里配置了Hosting重写，很可能不小心把云函数的请求路径给重定向到了React的路由（比如index.html），这就会触发预请求的重定向错误：

• 打开firebase.json，找到hosting.rewrites部分
• 确保没有类似这样的规则会覆盖云函数路径：

  {
    "source": "**",
    "destination": "/index.html"
  }
  

  如果有这条规则，要在它前面添加一条针对云函数的例外规则：

  {
    "source": "/functions/**",
    "function": "*"
  }
  

  这样Hosting会把/functions/开头的请求转发到对应的云函数，而不是重定向到React页面

3. 云函数代码返回了重定向响应 #

httpsCallable要求云函数返回JSON格式的响应，如果你的函数里不小心用了重定向（比如res.redirect()），就会导致请求被重定向，触发CORS错误：

• 检查你的云函数代码，确保是用正确的方式返回数据。比如对于onCall类型的函数，直接return JSON对象即可：

  exports.secondAddMessage = functions.https.onCall((data, context) => {
    // 你的业务逻辑
    return { result: "Message added successfully" };
  });
  

  如果你用的是onRequest类型的函数，要确保用res.send()返回JSON，而不是res.redirect()

4. 直接验证云函数URL #

你可以直接在浏览器地址栏输入云函数的URL（https://us-central1-(redacted).cloudfunctions.net/secondAddMessage），看看返回的内容：

• 如果返回的是HTML页面或者重定向，说明函数本身或者路由配置有问题
• 如果返回{"error":{"message":"Bad Request"}}，说明函数是正常运行的，只是调用方式的问题（httpsCallable需要发送POST请求，并且body是特定格式的JSON）

总结排查步骤 #

1. 用firebase functions:list确认函数存在且区域匹配
2. 检查firebase.json的重写规则，排除Hosting的干扰
3. 核对云函数代码，确保返回的是JSON而非重定向
4. 等待部署生效后再测试，必要时直接访问函数URL验证

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