使用XMLHttpRequest向Cloud Functions传参遇多类错误，求解决方案

咱们一步步拆解你的问题，逐个解决：

1. 修复跨域错误 #

你在前端设置Access-Control-Allow-Origin请求头是完全错误的——这个是服务器返回给浏览器的响应头，不是前端发送的请求头。浏览器看到前端发送这个头反而会触发异常，真正的跨域许可需要在Cloud Functions里配置。

前端修改： #

直接移除这行无效代码：

xhttp.setRequestHeader( 'Access-Control-Allow-Origin', '*');

服务器端（Cloud Functions）配置CORS： #

如果你的Cloud Functions基于Node.js开发，推荐用cors库快速处理跨域：

const functions = require("firebase-functions");
const cors = require("cors")({ origin: true }); // 允许所有来源，生产环境可指定具体域名
const admin = require("firebase-admin");
admin.initializeApp();

exports.Add = functions.https.onRequest((req, res) => {
  // 用cors中间件处理跨域逻辑
  cors(req, res, () => {
    // 后续业务逻辑写在这里
  });
});

如果不想依赖第三方库，也可以手动设置响应头：

exports.Add = functions.https.onRequest((req, res) => {
  // 设置跨域响应头
  res.set('Access-Control-Allow-Origin', '*');
  res.set('Access-Control-Allow-Methods', 'POST');
  res.set('Access-Control-Allow-Headers', 'Content-Type');

  // 处理浏览器的OPTIONS预检请求
  if (req.method === 'OPTIONS') {
    res.status(204).send('');
    return;
  }

  // 后续业务逻辑
});

2. 解决参数为null/NaN的问题 #

服务器端接收的参数无效，大概率是前端的userid或amt本身就是未定义、非数字/字符串的无效值。

前端修改： #

发送请求前先校验参数有效性，避免传递无效值：

// 先校验参数合法性
if (!userid || typeof userid !== 'string' || isNaN(amt) || amt <= 0) {
  console.error('参数错误：userid必须是非空字符串，amt必须是正数');
  return;
}

// 确保amt是数字类型
var params1 = { "AuthID": userid, "Amount": Number(amt) }; 
var params = JSON.stringify(params1);

// 合并重复的请求状态监听（onload和onreadystatechange选一个即可）
xhttp.onload = function() {
  if (this.status === 200) {
    alert(this.responseText);
    var data = JSON.parse(this.responseText);
    console.log(data);
  } else {
    console.error('请求失败，状态码：', this.status);
  }
};
// 移除onreadystatechange的重复监听代码

3. 修复"documentPath无效"错误 #

这个错误是因为你在Cloud Functions中操作Firestore时，传入的文档路径是空字符串（根源是AuthID参数无效）。

服务器端修改： #

处理业务逻辑前先严格校验请求参数：

exports.Add = functions.https.onRequest((req, res) => {
  cors(req, res, () => {
    // 仅允许POST请求
    if (req.method !== 'POST') {
      return res.status(400).send('仅支持POST请求');
    }

    // 解析请求体参数
    const { AuthID, Amount } = req.body;

    // 校验核心参数
    if (!AuthID || typeof AuthID !== 'string' || AuthID.trim() === '') {
      return res.status(400).send('AuthID必须是非空字符串');
    }
    if (isNaN(Amount) || Amount <= 0) {
      return res.status(400).send('Amount必须是正数');
    }

    // 操作Firestore的示例代码
    return admin.firestore().collection('yourCollection').doc(AuthID)
      .set({ Amount: Amount })
      .then(() => {
        res.status(200).send({ success: true, message: '添加成功' });
      })
      .catch(err => {
        console.error('Firestore操作错误：', err);
        res.status(500).send('服务器内部错误');
      });
  });
});

最后测试步骤 #

1. 修改完Cloud Functions代码后，记得重新部署到云端才会生效
2. 前端页面运行时，打开浏览器控制台，确认userid和amt是有效类型和值
3. 发送请求，查看控制台是否还有跨域错误，以及服务器返回的响应

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