提交简单的表单并在屏幕前后捕获

Question

我正在尝试使用 phantomjs 提交一个简单的表单

这是我的代码

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

page.settings.userAgent = 'Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/37.0.2062.120 Safari/537.36';
page.onLoadFinished = function(){

    page.render("after_post.png");
    console.log("done2!" );
    phantom.exit();

};

page.open('http://localhost/bimeh/phantom/testhtml.php', function(status) {

    page.includeJs("http://code.jquery.com/jquery-latest.min.js", function() {

        page.evaluate(function() {
           $("[name='xxx']").val('okk');
            page.render("pre_post.png");
            console.log('done1!');
            $('#subbtn').click();
        });
    });
});

问题是我没有得到 pre_post.png 图像，她是我的输出

$ phantomjs test.js
done2!

似乎在 page.evaluate 可以执行任何操作之前调用了 onLoadFinished ... 同样在 after_post.png 中，我在提交操作之前获取了表单图片

我正在使用 phantomjs 1.98（我已经从 2.1 降级，因为它想要输出错误显然是由于 qt 中的一些错误）

Answer 1

这是错误的：

page.evaluate(function() {
    page.render("pre_post.png"); // <----
});

page.evaluate 就好像您在浏览器中加载了一个页面，然后在开发人员工具控制台中加载了运行脚本。那里没有变量 page 。 page属于PhantomJS级别的脚本：

page.open('http://localhost/bimeh/phantom/testhtml.php', function(status) {

    page.includeJs("http://code.jquery.com/jquery-latest.min.js", function() {
        page.render("pre_post.png");

        page.evaluate(function() {
            $("[name='xxx']").val('okk');
            $('#subbtn').click();
        });
    });
});

page.onLoadFinished 每次页面加载完成时调用：PhantomJS 第一次打开脚本和提交表单时第二次。您可以保持功能不变，在这种情况下，如果提交表单，原始页面的第一个屏幕截图将被第二个屏幕截图覆盖。

但是很可能您的表单不会被提交，因为按钮在 PhantomJS 中没有 click 方法，它是在 2.x 中添加的。

您的脚本还缺少一个关键的东西：错误控制。请使用 page.onError 回调来捕获页面上的任何错误（您可以简单地从此处复制函数：http://phantomjs.org/api/webpage/handler/on-error.html ）

提交简单的表单并在屏幕前后捕获

submitting simple form and capturing before and after screen

javascript

phantomjs