Question

我正在开发一个单页应用程序。我第一次构建适当的单页应用程序并陷入困境。

每个页面都有一组可以触发的异步操作。这些行动最多可能需要30秒。

用户可能会更改页面，导致异步操作在完成时失败。

每次页面更改时都会重新呈现页面HTML，因此由于缺少DOM元素和/或其他资源/变量而导致操作失败。此外，变量和其他资源可能会因状态的变化而发生变化。

你如何处理这类问题？

我认为取消正在进行的请求几乎是不可能的，除非它在检查点中分开，在继续检查之前进行检查。

我猜有些选择是：

使用active page检查结束每个功能。在与每个资源交互之前，必须在检查点完成此操作，以防止出现不必要的行为。
抓住例外，让它们无声地失败

有什么想法？：）

Answer 1

使用活动？当您想要取消请求时发出一个事件，并让请求监听事件/准备好优雅地处理它。

function Potato {
  this.running = true;
}

Potato.prototype.stop = function () {
  this.running = false;
}

Potato.prototype.dostuff = function () {
  var things = [1, 2, 3];

  Object.keys(things).forEach(function(k) {
    if (!this.running) {
      break;
    }
    console.log(k);
  });
}

var potato = new Potato;
potato.on('stop', potato.stop);
this.emit('stop');

对不起，不是完全干净的代码，但你明白了吗？

Answer 2

如果是单页应用，用户如何更改页面？
与任何用户体验决策一样，这都是关于反馈的......你必须让用户了解正在发生的事情。如果用户可以在页面执行某些操作时继续移动，则您需要提醒用户采取其他操作将放弃他们所做的更改，或者阻止他们执行其他操作，直到当前操作完成。如果是后者，则在代码中创建一个“处理”标志并不常见，该标志在操作启动时被触发，并在操作完成时被清除。这样，如果用户尝试其他会中断操作的交互，您可以在允许用户的最新操作完成之前通过检查当前是否正在处理任何内容来处理它。（上面的Zipp的例子说明了这种策略。）

JS / HTML - 单页应用程序 - 取消异步操作

2 个答案: