Cloud Functions中设置Access-Control-Allow-Credentials为true未生效的问题求助

看起来你遇到了Cloud Functions里CORS凭证配置的棘手问题，明明已经设置了Access-Control-Allow-Credentials: true，却还是收到报错，而且预检请求返回204、正式请求失败，换成Express反而正常。先把你的代码贴出来方便大家定位问题：

客户端Web App代码 #

async function verify(idToken) {
  const url = "<cloud func>";
  const option = {
    method: "POST",
    headers: {
      "Content-Type": "application/json",
    },
    credentials: 'include',
    body: JSON.stringify({
      idToken: idToken,
    }),
  };
  const response = await fetch(url, option);
  const data = await response.json();
}

Cloud Functions代码 #

exports.verifyIdToken = onRequest(
  {
    cors: "<client domain>",
  },
  async (req, res) => {
    try {
      const idToken = req.body.idToken;
      const tokenPayload = await verifyJWT(idToken);
      res.set({
        "Access-Control-Allow-Credentials": true,
        "Access-Control-Allow-Origin": "<client domain>",
      });
      res.cookie("Cookie_Name", "values", {
        maxAge: 3600,
        httpOnly: true,
        secure: true,
        sameSite: "none",
        path: "<client domain>",
      });
      res.json({ result: "success" });
    } catch (error) {
      logger.error("JWT failed:", error.message);
      if (error.message == "jwt expired") {
        res.json({ result: "expired" });
      } else {
        res.json({ result: error.message });
      }
    }
  }
);

问题核心分析 #

你提到的报错"The value of the 'Access-Control-Allow-Credentials' header in the response is '' which must be 'true' when the request's credentials mode is 'include'."，大概率是预检请求（OPTIONS）没有返回正确的Access-Control-Allow-Credentials头导致的。虽然你在正式请求里手动设置了这个头，但浏览器会先校验预检请求的响应头，而Cloud Functions的默认CORS配置可能没处理好这一点。

另外还有两个潜在的坑：

1. CORS配置冲突：你既在onRequest的选项里设置了cors: "<client domain>"，又手动调用res.set设置Access-Control-Allow-Origin，这可能导致头信息被覆盖或异常。
2. Cookie的Path设置错误：你把path设为了<client domain>，但Cookie的path应该是网站的路径（比如/），而不是域名，这个错误虽不直接导致CORS报错，但会影响后续Cookie的正常使用。

解决方案 #

方案一：优化Cloud Functions的CORS配置

直接在onRequest的cors选项里包含credentials: true，让Cloud Functions自动处理预检和正式请求的头信息，避免手动设置的冲突：

exports.verifyIdToken = onRequest(
  {
    cors: {
      origin: "<client domain>", // 替换为你的客户端域名
      credentials: true // 关键：开启凭证支持
    },
  },
  async (req, res) => {
    try {
      const idToken = req.body.idToken;
      const tokenPayload = await verifyJWT(idToken);
      
      // 移除手动设置的Access-Control-Allow-*头，由cors配置自动处理
      res.cookie("Cookie_Name", "values", {
        maxAge: 3600,
        httpOnly: true,
        secure: true,
        sameSite: "none",
        path: "/", // 修正path为根路径
      });
      res.json({ result: "success" });
    } catch (error) {
      logger.error("JWT failed:", error.message);
      if (error.message == "jwt expired") {
        res.json({ result: "expired" });
      } else {
        res.json({ result: error.message });
      }
    }
  }
);

方案二：手动处理预检请求

如果方案一没生效，可能是Cloud Functions的默认CORS处理没覆盖到预检请求，这时候可以手动拦截OPTIONS请求并返回正确的头：

exports.verifyIdToken = onRequest(
  {
    cors: "<client domain>",
  },
  async (req, res) => {
    // 手动处理预检请求
    if (req.method === 'OPTIONS') {
      res.set('Access-Control-Allow-Origin', '<client domain>');
      res.set('Access-Control-Allow-Credentials', 'true');
      res.set('Access-Control-Allow-Methods', 'POST'); // 允许的请求方法
      res.set('Access-Control-Allow-Headers', 'Content-Type'); // 允许的请求头
      res.status(200).send('');
      return;
    }

    // 正式请求处理逻辑
    try {
      const idToken = req.body.idToken;
      const tokenPayload = await verifyJWT(idToken);
      res.set({
        "Access-Control-Allow-Credentials": true,
        "Access-Control-Allow-Origin": "<client domain>",
      });
      res.cookie("Cookie_Name", "values", {
        maxAge: 3600,
        httpOnly: true,
        secure: true,
        sameSite: "none",
        path: "/",
      });
      res.json({ result: "success" });
    } catch (error) {
      logger.error("JWT failed:", error.message);
      if (error.message == "jwt expired") {
        res.json({ result: "expired" });
      } else {
        res.json({ result: error.message });
      }
    }
  }
);

额外注意点

• 确保客户端域名和Cloud Functions中设置的<client domain>完全一致，包括协议（http/https）和端口号（本地开发时比如http://localhost:3000）。
• 本地测试Cloud Functions时，要使用firebase serve或正确的本地代理，避免跨域环境异常。

备注：内容来源于stack exchange，提问作者ido han