Question

我正在尝试使用RxJS来实现服务调用限制/排队。

例如，Google Maps的Geocoder API。假设我不希望每秒调用一次以上，但我的应用程序的一个或多个部分可能会更频繁地请求地理编码。我希望请求排队，相邻的请求至少 1s，但我也希望能够“取消”一个请求，如果在此等待期间不再需要它。

这是RxJS的适用用途，如果是这样的话，那会是什么样的？

感谢。

Answer 1

以下内容应该指导您（jsfiddle）：

// Helper functions
function remove_from_queue(queue, id) {
  queue.forEach(function(x, index){
    if (x.execute.request === id) {
      queue.splice(index, 1);
    }
  });
//  console.log('queue after removal', queue);
}

function add_to_queue (queue, id){
  queue.push({execute : {request : id}});
}

function getFirstInQueue(queue){
  return queue[0];
}

function noop(x) {}

function log(label) {
  return function (x) {
    console.log.call(console, label, x);
  }
}

function timestamp(label){
  return function (x) {
    console.log.call(console, Date.now() - startingDate, label,x );
  }
}

function label(label){
  return function (x) {
    var res = {};
    res[label] = x;
    return res;
  }
}

var startingDate = Date.now();

var requests$ = Rx.Observable.generateWithRelativeTime(
  {request : 1},
  function (x) { return x.request < 10; },
  function (x) { return {request : x.request + 1}; },
  function (x) { return x; },
  function (x) { return 100 ; }
);

var cancelledRequests$ = Rx.Observable.generateWithRelativeTime(
  {request : 1},
  function (x) { return x.request < 20; },
  function (x) { return {request : x.request + 4}; },
  function (x) { return x; },
  function (x) { return 500 ; }
);

var timer$ = Rx.Observable.interval(990).map(function (){return {}}).take(10);

var source$ = Rx.Observable.merge(
  requests$.map(label('execute')),
  cancelledRequests$.map(label('cancel')),
  timer$
)
//.do(log('source'));

controlledSource$ = source$
  .scan(function (state, command){
    var requestsToExecuteQueue = state.requestsToExecuteQueue;
    if (command.cancel) {
      remove_from_queue(requestsToExecuteQueue, command.cancel.request);
    }
    if (command.execute) {
      add_to_queue(requestsToExecuteQueue, command.execute.request);
    }
    console.log('queue', requestsToExecuteQueue.slice())

    return {
      command : command,
      requestExec$ : Rx.Observable
        .return(getFirstInQueue(requestsToExecuteQueue))
        .filter(function(x){return x})
        .do(function(x){remove_from_queue(requestsToExecuteQueue, x.execute.request)}),
      requestsToExecuteQueue : requestsToExecuteQueue
    }
  }, {command : undefined, requestExec$ : undefined, requestsToExecuteQueue : []})
  .pluck('requestExec$')
  .sample(Rx.Observable.interval(1000))
  .mergeAll();

controlledSource$.do(timestamp('executing request:')).subscribe(noop)

基本上：

scan用于管理状态（请求队列，添加和删除）
对于每个请求，我们传递一个observable（当订阅时）释放队列的第一个元素，并从队列中删除该元素
sample用于每秒钟获得一个这样的可观察
mergeAll允许订阅该可观察的
我们必须使用timer$对象继续轮询队列，即使请求源已完成（您仍需要清空剩余请求的队列）。您可以通过在完成源代码或最适合您的情况下让计时器$发出X秒来适应您的实际情况。

RxJS服务呼叫Throtting / Queuing

1 个答案: