如何将firebase REST API响应转换为打字稿中的数组？

Posted 2023-03-13

【中文标题】如何将firebase REST API响应转换为打字稿中的数组？

【英文标题】：How to turn a firebase REST API response into an array in typescript?

【发布时间】：2020-11-27 06:59:20

【问题描述】：

我目前在处理我在我的 Angular 应用程序中使用 REST 对我的 firebase 实时数据库所做的响应数据时遇到问题。只是前言：我会诚实的。我正在慢慢学习 Angular 和 Firebase。

我的数据库中有一个名为“pending-orders”的子路由

https://i.imgur.com/C1EXaEi.png

那里的每个唯一 ID 都与当时下订单的登录用户相匹配。

为了获取我所有的挂单，我正在向我的数据库发送一个 GET http 请求，正如 firebase 文档所建议的那样，端点是 pending-orders.json。

这给了我一个响应，我认为这将是一个数组。而是具有嵌套对象的对象。我记录了响应，即：

G2v12VlKwNPXwtUDV4g41PIqHZx1: …, hYgflcf7WGR6wLrCPkAL1B4MbZI3: …

我需要的是一个包含子项（该响应对象中键的值）的数组。我不完全确定如何获得。如何实现这一目标？

顺便说一句……

事实上，我什至不确定如何提取其唯一 ID 已由 firebase 本身（通过 POST 请求）生成的子节点。

除非我跳过了 REST API 文档中的某些内容，否则它们会介绍新插入的子节点如何通过 POST 请求获取自己的唯一 ID，但稍后不讨论如何特别或通过集合访问这些子节点（如我我试图做）。就我而言，客户无法知道这些唯一 ID（或我自己生成的自定义 ID）。

【问题讨论】：

仅供参考：AngularFire 提供了一个用于实时数据库的 TypeScript API，因此您不必直接使用 REST API。

你可以使用Angular File

当然，您可以只使用 for ... in 循环或 Object.entries() 来转换为数组。还是不适合您的需求？

【参考方案1】：

由于 TypeScript 只是 javascript，您可以执行以下操作：

const pendingOrdersResponse = await firebase.handwaving.pendingOrders();
const pendingOrdersTransformed = Object.keys(pendingOrdersResponse).map(id => 
  return  uuid: id, ...pendingOrdersResponse[id] ;
);

然后pendingOrdersTransformed 将是一个数组，其中您的数据为数组中的普通 JavaScript 对象，生成的 ID 为数组中每个 pendingOrder 上的 uuid 字段。

【参考方案2】：

按照 Jay Codist 的评论，我已根据从 firebase 获得的响应数据执行以下操作来构建自己的 ProcessedOrders 数组。我想出的解决方案如下：

fetchPurchaseOrders(): void 
this.http
  .get('https://APP-NAME.firebaseio.com/pending-orders.json')
  .subscribe((res) => 
    if (res) 
      const processedOrders: ProcessedOrder[] = [];
      for (const [key, value] of Object.entries(res)) 
        processedOrders.push(value as ProcessedOrder);
      
      console.log(processedOrders);
    
  );

这允许我保存订单，而无需关心我为数据库中每个子节点设置的自定义 ID。那里的 console.log() 使我能够根据需要打印出所有订单。这意味着 ProcessedOrders 数组现在可以在应用程序中使用，但我想要。

我不禁想知道我可能因为没有正确考虑而破坏了我的数据结构。如果我只想查看订单，这种方法会很棒，但如果我想从管理方面更新有关订单的任何信息，那么这种方法就不是很好了，因为我仍然必须依赖我最初给他们的自定义 ID。

我也可能会像其他评论者建议的那样花时间学习 AngularFire。也许它会比 REST API 更好更容易理解。

无论如何。问题已经解决，因为我的问题的初衷是如何将响应变成数组。

谢谢大家帮忙！