在 Casperjs 中循环 URL

Question

我正在尝试使用 Casperjs 按顺序打开几个 URL。

这是我实际代码的简化版本。

casper = require('casper').create()
casper.start()

casper.then () ->
  items = ['http://www.google.com', 'http://www.yahoo.com']

  for item, idx in items
     this.open item
     this.then ((idx) ->
        () ->
            this.capture idx + '.png')(idx)

casper.run()

在我的实际代码中，items 数组是在运行时生成的。我希望这段代码会提供 google.com 和 yahoo.com 的屏幕截图，但实际上这两个屏幕截图都以 yahoo.com 结尾。我觉得这与在循环中创建闭包有关，但我不知道如何。当open 被调用时，item 指的是一个特定的字符串。我永远不会结束它，是吗？

Answer 1

问题是casper.open 没有添加步骤，所以它不是异步的（如thenOpen）。它立即在外部then 内部执行。但是下面的then 是异步的，所以它的步骤被添加到当前步骤之后执行（外部then）。两个opens 都被执行，但是两个thens 的回调都是在最后一个open 之后执行的。

所以解决方案是使用thenOpen 作为组合异步步骤。直接解决方案有一个小问题：

CoffeeScript is a little language that compiles into JavaScript.

这意味着 JavaScript 的误解适用。就是这个：JavaScript closure inside loops – simple practical example

for item, idx in items 行仍然是 for loop in JavaScript。 JavaScript 具有函数级作用域，casper.then 是一个异步步进函数，这意味着所有 casper.then 调用的回调在循环完全运行后执行（更准确地说是在当前步骤完成后或 casper.run 完成后调用），但casper.open 会立即执行。

解决方案：将 casper.open 和 casper.then 组合到 casper.thenOpen 并通过 IIFE 传递 item 和 idx 以便它们固定到每次迭代：

for item, idx in items
    ((item, idx) ->
        casper.thenOpen item, () ->
            this.capture idx + '.png'
    )(item, idx)

或使用Array.prototype.forEach:

items.forEach (item, idx) ->
    casper.thenOpen item, () ->
        this.capture idx + '.png'