Question

我有一个 NodeJS 应用程序进行一些计算，我想填写客户端上的进度条（ AngularJS ），显示完成的计算量。现在我做这样的事情：

服务器端：

var compute_percent = 0;

router.post('/compute', function(req, res) {
   myTask.compute1(function(result) {
      compute_percent = 33;
      myTask.compute2(function(result2) {
         compute_percent = 66;
         myTask.compute3(function(result3) {
            compute_percent = 100;
            res.json(result3);
         });
      });
   });

}
router.get('/compute_percent', function(req, res) {
   res.json(compute_percent);
}

客户端

angular.module('myApp').controller('myCtrl', 
   function($scope, $interval, $http) {
      $interval(function() {
         $http.get('/compute_percent').success(function(result) {
            $scope.percent = result});
         }, 
      500);
   }
});

我不喜欢的是我最终做了很多请求（如果我希望进度条准确）并且几乎所有请求都没用（状态没有改变服务器端）。

如果服务器向侦听客户端发送计算状态发生变化的消息，我该如何“反转”此代码？

Answer 1

您有三种可能的方法：

标准推送

通过使用套接字或任何可以双向通信的方式，您可以快速进行信息交换。它将使用许多请求更新进度条，但速度非常快，每秒可以支持大量请求。

长池

浏览器发送请求，服务器不会立即响应，而是等待事件发生，然后通过响应进行报告。然后，浏览器应用其操作并发送另一个将等待的请求。

使用此技术，您只需在服务器需要时进行更新。但如果你想要很高的准确度，这仍然会产生很多请求。

Pushlet

客户端仅发送一个请求，服务器用javascript填充它，这将更新进度条。响应是流以保持连接打开，并且在需要时发送javascripts更新。

响应如下：

set_progress(0);
// nothing for X seconds
set_progress(10);
// nothing for X seconds
set_progress(0);
....

与其他人相比，您仍然会发送相同数量的信息，但在一个请求中，所以它不那么重。

我认为更容易实现的是长池。

如何流式传输数据以提供进度条

1 个答案:

标准推送

长池

Pushlet