使用PhantomJS注入並使用Firebug-Lite

Question

我試圖使用PhantomJS將Firebug &注入到網頁中，但我無法訪問它們。

我已經嘗試了用於將其他JS添加到頁面的兩個PhantomJS方法：page.injectJs（）和page.includeJs。

我無法從includeJs中獲得任何返回的內容（我從閱讀文檔時並不期望得到它）。我試圖使用firebug-lite和jQuery函數或對象（如$和inspect（））後，我得到錯誤，說他們是未定義的或變量無法找到。

這是我的完整腳本。您還可以在這裏看到：http://piratepad.net/XTPefXOB4o

"use strict"; 
"use warnings"; 

var page = new WebPage(), address; 
var useragent = "PhantomJS Firebug integration tool (Macintosh; Intel Mac OS X 10_7_3) AppleWebKit/535.11 (KHTML, like Gecko) Chrome/17.0.963.56 Safari/535.11"; 

page.onConsoleMessage = function (msg) { 
    console.log("+eval:" + msg); 
}; 

page.open(address, function (status) { 
    if (status !== 'success') { 
     console.log('Unable to access network'); 
    } else { 
     console.log("got into page.open()"); 

     var testInclude = page.includeJs("http://getfirebug.com/releases/lite/1.4/firebug-lite.js", function() { 
      var result = true; 
      try { 
       inspect($("*")[5]); 
      } 
      catch(err) { 
       result = false; 
      } 
      console.log("from includeJS: " + result); 
      return result; 
      // is there any way to return a value from this? 
     }); 

     var results = page.evaluate(function() {  
      var debug = []; 

      try { 
       page.injectJs("http://getfirebug.com/releases/lite/1.4/firebug-lite.js"); 
       page.injectJs("http://pconerly.webfactional.com/site_media/js/jquery-1.7.min.js"); 
      } catch(err) { 
       debug[0] = false; 
      } 
      debug[0] = true; 

      debug[1] = true; 
      try { 
       // all 3 of these commands fail. 
       //$(document); 
       inspect(document.querySelectorAll("*")[i]); 
       //firebug; 
      } 
      catch(err) { 
       console.log(err.message) 
       debug[1] = false; 
      } 

      //debug[1] = inspectAEl(5); 

      return debug; 
     }); 

     var stuff = results; 
     console.log("did not error on injecting JS: " + stuff[0]); 
     console.log("used inspect within page.evaluate: " + stuff[1]); 

     console.log("return value from includeJs: " + testInclude); 

     console.log("processing finished");    
    } 
    phantom.exit(); 
});  

這是我的輸出：

$ phantomjs firebug-integration.js 
got into page.open() 
+eval:Can't find variable: inspect 
did not error on injecting JS: true 
used inspect within page.evaluate: false 
return value from includeJs: undefined 
processing finished 

Answer 1

你已經有了一些困惑在這裏每一個功能的情況下：

• 當你運行includeJs(url, callback)，callback函數在PhantomJS上下文中運行。所以它可以訪問page，但是而不是可以訪問由包含腳本創建的變量和名稱空間 - 這些都包含在客戶端上下文中，並且可用於通過page.evaluate()運行的函數。

• 您正試圖在page.evaluate()內運行page.injectJs()。這將不起作用 - 您在page.evaluate()中運行的函數在客戶端執行上下文中被沙箱化，並且無法訪問page對象。

所以，你應該嘗試這些方法之一 - 無論是在page.includeJs()回調運行page.evaluate()：

page.includeJs("http://getfirebug.com/releases/lite/1.4/firebug-lite.js", 
     function() { 
      page.evaluate(function() { 
       // do stuff with firebug lite here 
       console.log(inspect($("*")[5])); 
      }); 
     }); 

或運行page.injectJs()和然後運行page.evaluate()：

// note - this is a reference to a local file 
page.injectJs("firebug-lite.js"); 
page.evaluate(function() { 
    // do stuff with firebug lite here 
    console.log(inspect($("*")[5])); 
});