PhantomJS：在任何其他脚本运行之前注入脚本答案

【问题标题】：PhantomJS: injecting a script before any other scripts runPhantomJS：在任何其他脚本运行之前注入脚本
【发布时间】：2013-03-17 08:57:08
【问题描述】：

使用 PhantomJS，我想注入一些 JS，就好像在任何其他 <script> 标记之前有一个额外的 <script> 标记一样。这是因为页面上的脚本使用了一些PhantomJS没有的功能，即Function.prototype.bind和window.webkitRequestAnimationFrame。我有一个 JS 文件，其中包含两者的自定义实现，我希望 PhantomJS 在页面上运行脚本时使用它们。

困难在于如果我在page.open之前做page.injectJs，脚本会被注入到一个空的页面中，并不会被带到正在打开的页面。

或者，如果我在 page.open 之后执行 page.injectJs，则为时已晚，因为 JavaScript 错误（未定义的函数）已经发生。

我找到了一种看似可行但显然是 hack 的方法：

page.onResourceReceived = function() {
    page.injectJs('phantom-hacks.js')
};

这会多次注入它（显然，每个资源两次），但这没关系，因为我的脚本是幂等的。但是，我想知道执行此操作的正确方法：仅在页面上的任何脚本运行之前注入一次。

谢谢:)

【问题讨论】：

为什么不保留所有要注入的文件的哈希值，其中键是文件，值是是否已注入，如果尚未注入，则注入它？或者您可以在第一次运行后停止事件侦听器？

标签： phantomjs

【解决方案1】：

我认为除了挂钩事件之外，没有“正确”的方式来注入此类脚本。我花了半年时间大量使用 PhantomJs，发现在所有错误开始发生之前但在页面完成加载之后无法注入。

我会尝试通过 onInitialized、onLoadStarted、onLoadFinished。在钩子中，我会调用 page.evaluate()，它只会修改 DOM 以在任何你喜欢的地方都有这个额外的地方。

我认为其中一个（钩子）应该给你你想要的正确时机。

干杯

【讨论】：

使用onInitialized 和injectJs（将相对路径传递给polyfills）在我的情况下非常有效。
@MarcoLazzeri 感谢您的评论，onInitialized 正是我出于相同目的所需要的。