在 C# 中查看生成的源代码（在 AJAX/JavaScript 之后）

Question

有没有办法从 C# 应用程序中查看生成的网页源代码（所有 AJAX 调用和 JavaScript DOM 操作发生后的代码），而无需从代码中打开浏览器？

使用WebRequest 或WebClient 对象查看初始页面可以正常工作，但如果页面大量使用JavaScript 来更改页面加载时的DOM，则这些无法提供页面的准确图片。

我尝试过使用Selenium 和Watin UI 测试框架，它们运行良好，提供了所有JavaScript 操作完成后出现的生成源。不幸的是，他们通过打开一个非常慢的实际网络浏览器来做到这一点。我已经实现了一个 selenium 服务器，它将这项工作卸载到另一台机器上，但仍然存在很大的延迟。

是否有一个 .Net 库可以加载和解析页面（如浏览器）并输出生成的代码？显然，谷歌和雅虎并没有为他们想要抓取的每个页面打开浏览器（当然他们可能比我拥有更多的资源......）。

除非我愿意剖析开源浏览器的源代码，否则是否有这样的库？

解决方案

嗯，谢谢大家的帮助。我有一个比 Selenium 快 10 倍的工作解决方案。哇！

感谢old article from beansoftware，我能够使用 System.Windows.Forms.WebBrowser 控件下载页面并对其进行解析，然后将生成的源代码提供给他们。即使控件在 Windows.Forms 中，您仍然可以从 Asp.Net 运行它（我正在这样做），只需记住将 System.Window.Forms 添加到您的项目引用中。

代码有两点值得注意。首先，在新线程中调用 WebBrowser 控件。这是因为它必须在 single threaded apartment 上运行。

其次，GeneratedSource 变量设置在两个地方。这不是由于明智的设计决定:)我仍在努力，完成后会更新这个答案。 wb_DocumentCompleted() 被多次调用。首先是下载初始 HTML 时，然后是第一轮 JavaScript 完成时。不幸的是，我正在抓取的网站有 3 个不同的加载阶段。 1) 加载初始 HTML 2) 执行第一轮 JavaScript DOM 操作 3) 暂停半秒然后执行第二轮 JS DOM 操作。

由于某种原因，第二轮不是由 wb_DocumentCompleted() 函数引起的，但它总是在 wb.ReadyState == Complete 时被捕获。那么为什么不将它从 wb_DocumentCompleted() 中删除呢？我仍然不确定为什么它没有被抓住，这就是 beadsoftware 文章推荐的地方。我会继续调查的。我只是想发布此代码，以便任何有兴趣的人都可以使用它。享受吧！

using System.Threading;
using System.Windows.Forms;

public class WebProcessor
{
    private string GeneratedSource{ get; set; }
    private string URL { get; set; }

    public string GetGeneratedHTML(string url)
    {
        URL = url;

        Thread t = new Thread(new ThreadStart(WebBrowserThread));
        t.SetApartmentState(ApartmentState.STA);
        t.Start();
        t.Join();

        return GeneratedSource;
    }

    private void WebBrowserThread()
    {
        WebBrowser wb = new WebBrowser();
        wb.Navigate(URL);

        wb.DocumentCompleted += 
            new WebBrowserDocumentCompletedEventHandler(
                wb_DocumentCompleted);

        while (wb.ReadyState != WebBrowserReadyState.Complete)
            Application.DoEvents();

        //Added this line, because the final HTML takes a while to show up
        GeneratedSource= wb.Document.Body.InnerHtml;

        wb.Dispose();
    }

    private void wb_DocumentCompleted(object sender, 
        WebBrowserDocumentCompletedEventArgs e)
    {
        WebBrowser wb = (WebBrowser)sender;
        GeneratedSource= wb.Document.Body.InnerHtml;
    }
}

Answer 1

它可能正在使用浏览器的实例（在您的情况下：ie 控件）。您可以轻松地在您的应用程序中使用并打开一个页面。然后控件将加载它并处理任何 javascript。完成此操作后，您可以访问控件 dom 对象并获取“解释”代码。

Answer 2

最好的方法是使用PhantomJs。那太棒了。 （示例为Article）。

我的解决方案是这样的：

var page = require('webpage').create();

page.open("https://sample.com", function(){
    page.evaluate(function(){
        var i = 0,
        oJson = jsonData,
        sKey;
        localStorage.clear();

        for (; sKey = Object.keys(oJson)[i]; i++) {
            localStorage.setItem(sKey,oJson[sKey])
        }
    });

    page.open("https://sample.com", function(){
        setTimeout(function(){
         page.render("screenshoot.png") 
            // Where you want to save it    
           console.log(page.content); //page source
            // You can access its content using jQuery
            var fbcomments = page.evaluate(function(){
                return $("body").contents().find(".content") 
            }) 
            phantom.exit();
        },10000)
    });     
});

Answer 3

理论上可以，但目前不可以。

我认为目前没有产品或 OSS 项目可以做到这一点。这样的产品需要有自己的 javascript 解释器，并且能够准确地模拟它支持的每个浏览器的运行时环境和怪癖。

鉴于您需要准确模拟服务器+浏览器环境的东西才能生成最终页面代码，从长远来看，我认为使用浏览器实例是准确生成最终状态页面的最佳方式.尤其如此，当您考虑到页面加载完成后，页面源仍然可以在浏览器中从 AJAX/javascript 随时间变化。