Axios参数传递问题：Firebase实时数据库REST接口请求中参数值需带引号的处理

我太懂你这种明明Postman能跑，自己写的代码却报错的糟心感了——核心问题就是Firebase的REST API对查询参数格式有特殊要求，而Axios默认的参数序列化逻辑刚好破坏了这种格式。

问题根源 #

Firebase要求orderBy、startAt、endAt这类查询参数的值必须是带双引号的JSON字符串（比如orderBy="$key"），但Axios默认会自动对参数值做URL编码，把你传入的字符串直接转义，最终生成的URL里参数值丢失了引号，变成orderBy=$key，这就触发了Firebase的格式校验错误。

而你在Postman里手动给参数加了引号，生成的URL完全符合Firebase的要求，所以请求能正常工作。

两种可行的解决方案 #

方案1：手动拼接完整URL（简单直接）

如果参数不多，直接把带引号的参数拼接到URL里，跳过Axios的参数序列化逻辑：

axios({
  method: 'GET',
  url: 'https://projectname.firebaseio.com/latestMeasurements.json?orderBy="$key"&startAt="key000010"&endAt="key000020"'
})
.then((res) => {
  console.log("SUCCESSFUL FETCH", res.data);
})
.catch((e) => {
  console.log("ERROR", e);
});

方案2：自定义参数序列化（更优雅，适合动态参数）

如果参数需要动态生成或者数量较多，推荐用paramsSerializer自定义序列化逻辑，确保每个参数值都被双引号包裹：

axios({
  method: 'GET',
  url: 'https://projectname.firebaseio.com/latestMeasurements.json',
  params: {
    orderBy: "$key",
    startAt: "key000010",
    endAt: "key000020"
  },
  paramsSerializer: (params) => {
    // 遍历参数，给每个值加上双引号后拼接成查询字符串，同时处理特殊字符
    return Object.entries(params)
      .map(([key, value]) => `${key}="${encodeURIComponent(value)}"`)
      .join('&');
  }
})
.then((res) => {
  console.log("SUCCESSFUL FETCH", res.data);
})
.catch((e) => {
  console.log("ERROR", e);
});

这里用encodeURIComponent是为了避免参数值里的特殊字符（比如空格、符号）导致URL格式错误，让请求更健壮。

验证小技巧 #

你可以打开浏览器开发者工具的Network面板，查看Axios发送的请求URL，确认最终生成的地址和Postman里的完全一致——参数值都带有双引号，这样Firebase就能正确识别你的查询条件了。

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