使用页面标题作为PhantomJS中的屏幕截图文件名

时间:2015-07-21 18:38:39

标签: javascript phantomjs

以下PhantomJS代码可用于获取网页的页面标题<title>

var page = require('webpage').create();
page.open(url, function(status) {
    var title = page.evaluate(function() {
        return document.title;
    });
    console.log('Page title is ' + title);
    phantom.exit();
});

以下PhantomJS代码会将多个网址呈现为png文件。

    // Render Multiple URLs to file

    var RenderUrlsToFile, arrayOfUrls, system;

    system = require("system");

    /*
    Render given urls
    @param array of URLs to render
    @param callbackPerUrl Function called after finishing each URL, including the last URL
    @param callbackFinal Function called after finishing everything
    */
    RenderUrlsToFile = function(urls, callbackPerUrl, callbackFinal) {
    var getFilename, next, page, retrieve, urlIndex, webpage;
    urlIndex = 0;
    webpage = require("webpage");
    page = null;
    getFilename = function() {
        return "rendermulti-" + urlIndex + ".png";
    };
    next = function(status, url, file) {
        page.close();
        callbackPerUrl(status, url, file);
        return retrieve();
    };
    retrieve = function() {
        var url;
        if (urls.length > 0) {
            url = urls.shift();
            urlIndex++;
            page = webpage.create();
            page.viewportSize = {
                width: 800,
                height: 600
            };
            page.settings.userAgent = "Phantom.js bot";
            return page.open("http://" + url, function(status) {
                var file;
                file = getFilename();
                if (status === "success") {
                    return window.setTimeout((function() {
                        page.render(file);
                        return next(status, url, file);
                    }), 200);
                } else {
                    return next(status, url, file);
                }
            });
        } else {
            return callbackFinal();
        }
    };
    return retrieve();
    };

    arrayOfUrls = null;

    if (system.args.length > 1) {
        arrayOfUrls = Array.prototype.slice.call(system.args, 1);
    } else {
        console.log("Usage: phantomjs render_multi_url.js [domain.name1, domain.name2, ...]");
        arrayOfUrls = ["www.google.com", "www.bbc.co.uk", "www.phantomjs.org"];
    }

    RenderUrlsToFile(arrayOfUrls, (function(status, url, file) {
        if (status !== "success") {
            return console.log("Unable to render '" + url + "'");
        } else {
            return console.log("Rendered '" + url + "' at '" + file + "'");
        }
    }), function() {
        return phantom.exit();
    });

渲染文件的名称格式为“rendermulti-”+ urlIndex +“。png”。但我希望它是页面标题+“。png”。如何根据我的要求修改上述代码。

1 个答案:

答案 0 :(得分:1)

由于page是全局的,您可以通过以下方式轻松更改getFilename()

getFilename = function() {
    var title = page.evaluate(function() {
        return document.title;
    });
    return title + ".png";
};

您也无需访问页面上下文(page.evaluate()内)以获取标题。您只需访问page.title

即可
getFilename = function() {
    return page.title + ".png";
};

可能是标题包含无法出现在目录或文件中的字符。如果它包含例如a/b,则会尝试将文件b.png写入目录a当然不存在。

只需删除此类字符:

return title.replace(/[\\\/:]/g, "_") + ".png";