本地运行Firebase项目遇CORS错误：预检请求失败（HTTP 500）

兄弟，我之前也踩过这个坑！你遇到的是典型的**CORS（跨源资源共享）**问题，再加上函数返回了500状态码，得两步走——先搞定跨域配置，再排查函数内部的错误。

先把你碰到的错误信息贴出来，方便大家对照：

无法加载https://us-centralx-xxx.cloudfunctions.net/xxx：预检请求的响应未通过访问控制检查：请求的资源上不存在'Access-Control-Allow-Origin'标头。因此，源'http://localhost:3000'被禁止访问。响应的HTTP状态码为500。

第一步：给Cloud Functions添加CORS响应头 #

不管函数有没有内部错误，先把跨域头加上，这样浏览器至少能拿到合法的跨域许可。下面是不同开发环境的配置方法：

Node.js环境（最常用） #

方式1：手动添加响应头

直接在函数里写死需要的CORS头，还得处理浏览器的OPTIONS预检请求：

exports.yourFunctionName = (req, res) => {
  // 设置允许的源，开发环境用localhost:3000，生产环境换成你的正式域名
  res.set('Access-Control-Allow-Origin', 'http://localhost:3000');
  // 允许的请求方法
  res.set('Access-Control-Allow-Methods', 'GET, POST, OPTIONS');
  // 允许的请求头
  res.set('Access-Control-Allow-Headers', 'Content-Type');

  // 处理OPTIONS预检请求，直接返回204即可
  if (req.method === 'OPTIONS') {
    res.status(204).send('');
    return;
  }

  // 这里写你的业务逻辑
  try {
    // 示例：返回成功响应
    res.status(200).send('请求成功！');
  } catch (error) {
    // 捕获错误并返回500
    res.status(500).send('服务器内部错误');
  }
};

方式2：用cors包简化配置

嫌手动写头麻烦？可以用官方维护的cors包：
先安装依赖：

npm install cors

然后在函数里引入使用：

const cors = require('cors')({ origin: true });

exports.yourFunctionName = (req, res) => {
  // 先通过cors中间件处理跨域
  cors(req, res, () => {
    // 处理预检请求
    if (req.method === 'OPTIONS') {
      res.status(204).send('');
      return;
    }

    // 业务逻辑代码
    try {
      res.status(200).send('请求成功！');
    } catch (error) {
      res.status(500).send('服务器内部错误');
    }
  });
};

Python环境 #

如果你的函数是用Python写的，同样在响应里添加头：

from flask import jsonify

def your_function_name(request):
    # 定义CORS头
    headers = {
        'Access-Control-Allow-Origin': 'http://localhost:3000',
        'Access-Control-Allow-Methods': 'GET, POST, OPTIONS',
        'Access-Control-Allow-Headers': 'Content-Type'
    }

    # 处理OPTIONS预检请求
    if request.method == 'OPTIONS':
        return ('', 204, headers)

    # 业务逻辑
    try:
        # 示例：返回JSON响应
        return jsonify({'message': '请求成功！'}), 200, headers
    except Exception as e:
        return jsonify({'error': str(e)}), 500, headers

第二步：排查函数的500错误 #

错误里的HTTP 500说明你的函数内部有bug，比如变量未定义、API调用失败、权限问题等等。你可以：

• 打开Google Cloud Console，找到对应的Cloud Functions，查看日志面板，里面会有详细的错误堆栈信息
• 在本地用functions-framework工具调试，模拟函数运行，更容易定位问题

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