如何在javascript加载页面后使用Anglesharp将HTML作为文本?

时间:2018-04-11 13:07:05

标签: javascript c# anglesharp

我正在尝试使用AngleSharp来抓取我的localhost上的网页。该页面是动态使用Angular js生成的。我正在使用AngleSharp来获取页面。还使用AngleSharp Scripting库来运行Javascript。以下是我的POC目的代码。在Javascript渲染完成后,我无法弄清楚在哪里可以找到页面的HTML。

.Result.Source.Text为我提供了网页的页面来源。在javascript完成渲染后,我在哪里可以找到Source?我甚至无法弄清楚javascript是否运行了!

    static void Main(string[] args)
    {
        Task<IDocument> t = StartCrawl();
        t.Wait();
        string textContent = t.Result.Source.Text;
        Console.ReadKey();

    }

    private static async Task<IDocument> StartCrawl()
    {
        var config = Configuration.Default
            .WithDefaultLoader()
            .WithCss()
            .WithJavaScript();

        var context = BrowsingContext.New(config);
        var document = await context.OpenAsync("http://localhost:8000/#!/phones");
        return document;
    }

网址的视图来源给了我这个。如何在页面加载后在页面上运行所有javascripts。我可以在document.Scripts属性中看到16个脚本。

&#13;
&#13;
<!doctype html>
<html lang="en" ng-app="phonecatApp">
  <head>
    <meta charset="utf-8">
    <title>Google Phone Gallery</title>
    <link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css" />
    <link rel="stylesheet" href="app.css" />
    <link rel="stylesheet" href="app.animations.css" />

    <script src="bower_components/jquery/dist/jquery.js"></script>
    <script src="bower_components/angular/angular.js"></script>
    <script src="bower_components/angular-animate/angular-animate.js"></script>
    <script src="bower_components/angular-resource/angular-resource.js"></script>
    <script src="bower_components/angular-route/angular-route.js"></script>
    <script src="app.module.js"></script>
    <script src="app.config.js"></script>
    <script src="app.animations.js"></script>
    <script src="core/core.module.js"></script>
    <script src="core/checkmark/checkmark.filter.js"></script>
    <script src="core/phone/phone.module.js"></script>
    <script src="core/phone/phone.service.js"></script>
    <script src="phone-list/phone-list.module.js"></script>
    <script src="phone-list/phone-list.component.js"></script>
    <script src="phone-detail/phone-detail.module.js"></script>
    <script src="phone-detail/phone-detail.component.js"></script>
  </head>
  <body>

    <div class="view-container">
      <div ng-view class="view-frame"></div>
    </div>

  </body>
</html>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:0)

在AngleSharp中(就像在浏览器中一样),在JS完成某些操作之后,没有源的概念。您可以查看原始传输的源,但是我想那不是您想要的。

如果您想在特定时间查看DOM的字符串序列化(例如,通过JS脚本对DOM进行一些操作之后),只需执行以下操作:

var currentSource = document.ToHtml(); // current serialization of the DOM

请注意,这将以HTML(文本)形式表示您的DOM。

您所做的为您提供了原始源代码:

var textContent = t.Result.Source.Text; // will always contain the original source