如何使用Node.js的axios或node-fetch将数据写入URL路径的JSON文件

核心结论 #

你无法直接通过axios或node-fetch发送POST请求修改https://xenialbase.web.app/file.json这类Firebase Hosting托管的静态JSON文件，静态托管服务本身不支持直接写入修改托管的静态资源。

返回200但数据未生效的原因 #

Firebase Hosting默认仅处理GET、HEAD等读取类请求，用于返回托管的静态资源。你发送的POST请求没有对应的服务端写入逻辑，返回200只是服务端的兜底响应（比如路由匹配到了默认规则、CORS预检请求返回成功），实际服务端并没有修改存储的file.json文件，因此刷新后看不到更新内容。

解决方案 #

Firebase生态下最合理的方案是改用Firebase Realtime Database存储需要读写的JSON数据，该服务原生提供REST读写接口，操作方式和你预期的直接读写URL路径的逻辑一致：

• 开通Realtime Database后你会得到专属数据库域名，格式为https://<你的项目ID>.firebaseio.com/
• 写入数据时如果要覆盖整个JSON内容使用PUT请求，要追加子节点数据使用POST请求，请求地址后缀加.json即可
• 需要提前在Firebase控制台调整数据库安全规则，开放对应路径的读写权限，测试阶段可以临时开放全读写权限，生产环境务必补充权限校验

调整后的参考代码 #

var axios = require("axios")
// 替换为你自己的Firebase Realtime Database对应路径地址
axios
  .put('https://<你的项目ID>.firebaseio.com/file.json', {
    todo: 'Buy the milk'
  })
  .then(res => {
    console.log(`statusCode: ${res.status}`)
    console.log(res.data)
  })
  .catch(error => {
    console.error(error)
  })

修改完成后直接GET同一个https://<你的项目ID>.firebaseio.com/file.json地址，就能拿到更新后的JSON数据。

如果确实需要修改Firebase Hosting上的静态文件，你需要额外部署云函数接收写入请求，在云函数内调用Hosting部署API更新静态资源，该方案复杂度高，非特殊需求不建议使用。

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