如何从 Vuejs 读取流 + json 响应？

Posted 2023-02-22

【中文标题】如何从 Vuejs 读取流 + json 响应？

【英文标题】：How to read stream+json responses from Vuejs?

【发布时间】：2019-03-19 01:35:10

【问题描述】：

我在 vuejs 应用程序中使用 axios http 客户端和这段代码：

axios.get('http://localhost:8081/pets')
    .then(response => 
      this.pets = response.data;
    )

如果服务器返回简单的“应用程序/json”内容，那么一切都很好。 但我想分别为每一行阅读“application/stream+json”。

例如：

axios.get('http://localhost:8081/pets')
    .then(response => 
      this.pets.push(response.data)
    )

但是这段代码（如预期的那样）不起作用。

【参考方案1】：

我用 SSE 解决了这个问题：

let es = new EventSource('http://localhost:8081/pets');
es.addEventListener('message', event => 
    let data = JSON.parse(event.data);
    this.pets.push(data);
, false);

【参考方案2】：

我不确定我是否正确理解了您的意思！但我提供了数据并单独使用。

axios.get('http://localhost:8081/pets')
    .then(response => 
      for(var key in response.data) 
         this.pets.push(response.data[key]);  //row by row
      
    )

【讨论】：

谢谢，但在这种情况下，需要等到服务器完全形成请求。但我想逐行读取流中的数据（准备就绪）。

你应该间隔调用api，所以将请求背靠背发送到api，直到api状态完成结果并为每个api调用推送dara，第二种方法是使用socket io。