如何使用asp.net和phantomjs获取页面的屏幕截图并将其返回给客户端

Question

我希望能够阅读一个网站的屏幕截图，并试图使用phantomjs和ASP.NET。

我已尝试使用page。渲染，将屏幕截图保存到一个文件。它作为控制台应用程序工作，但当我从asp.net处理程序调用它时就不是这样了。这可能是由于文件权限，因为简单的应用程序(如hello.js)工作良好。

没关系，我的偏好是不写入文件，而是处理字节并直接从处理程序返回图像。

我有点不知道该怎么做。我注意到一个叫做page的方法。renderBase64，但不知道如何使用。

当前我正在使用IHttpHandler。

这里有一个类似的问题，但那个人最终放弃了phantomjs。我喜欢它的外观，如果可能的话我想继续使用它。使用c#运行Phantomjs抓取网页快照

Answer 1

根据您最后的评论，您可以在phantom js文件中执行以下操作:

var base64image = page.renderBase64('PNG');
system.stdout.write(base64image);

在c#:

    var startInfo = new ProcessStartInfo {
    //some other parameters here
    ...
    FileName = pathToExe,
    Arguments = String.Format("{0}",someParameters),
    UseShellExecute = false,
    CreateNoWindow = true,
    RedirectStandardOutput = true,
    RedirectStandardError = true,
    RedirectStandardInput = true,
    WorkingDirectory = pdfToolPath
    };
    var p = new Process();
    p.StartInfo = startInfo;
    p.Start();
    p.WaitForExit(timeToExit);
    //Read the Error:
    string error = p.StandardError.ReadToEnd();
    //Read the Output:
    string output = p.StandardOutput.ReadToEnd();

在你的输出变量中，你可以读取从phantomJS返回的base64，然后用它做你计划的事情。

从这里使用Phantomjs的包装器nreco包装器

你可以在这里得到js for raster: rstorize

然后下面的c#代码将完成这项工作。

var phantomJS=new PhantomJS();
phantomJS.Run("rasterize.js", new[] { "http://google.com","ss.pdf" });

这个问题源于我对base64字符串实际是什么缺乏理解。

在phantomjs运行的javascript文件中，我可以像这样直接将base64图像写入控制台:

var base64image = page.renderBase64('PNG');
console.log(base64image);

在运行phantomjs的c#代码中，我可以将控制台输出转换回字节，并将图像写入响应，如下所示:

var info = new ProcessStartInfo(path, string.Join(" ", args));
info.RedirectStandardInput = true;
info.RedirectStandardOutput = true;
info.UseShellExecute = false;
info.CreateNoWindow = true;
var p = Process.Start(info);
p.Start();
var base64image = p.StandardOutput.ReadToEnd();
var bytes = Convert.FromBase64CharArray(base64image.ToCharArray(), 0, base64image.Length);
p.WaitForExit();
context.Response.OutputStream.Write(bytes, 0, bytes.Length);
context.Response.ContentType = "image/PNG";

这似乎避免了我遇到的文件锁定问题。

使用CasperJS加上PhantomJS，我已经得到了漂亮的网页照片。

var casper = require('casper').create();
casper.start('http://target.aspx', function() {
    this.capture('snapshot.png');
});
casper.run(function() {
    this.echo('finished');
});

我强烈建议你看看这个工具。我仍然不确定如何做post-back .

设置ProcessStartInfo对象的'WorkingDirectory'属性，以指定文件的保存位置