Если в системе не установлены нужные для сайта шрифты, если их нельзя установить, либо еще по какой-то причине phantomjs показывает вам квадратики, можете попробовать следующий способ.
На сайте, с которым работаем, задать @font-face для всех используемых шрифтов и только после этого читать/фотографировать содержимое страницы. ВНИМАНИЕ! Работает только на версии >= 1.6.
См. пример, здесь БУДУТ квадратики:
<!DOCTYPE HTML>
<html>
<head>
<title>@font-face demo</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body {
font-family: Arial;
margin: 50px;
}
</style>
</head>
<body>
<p>Тест русского текста.</p>
<p>Если вы видите русский текст, то тест успешно пройден.</p>
</body>
</html>
Для запуска можно использовать примерно такую команду:
phantomjs rasterize.js http://crusat.ru/demos/fontface/index-no-fontface.html test.png
А здесь со шрифтами все будет отлично:
<!DOCTYPE HTML>
<html>
<head>
<title>@font-face demo</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
@font-face {
font-family: Arial;
src: url(arial.ttf) format("truetype");
}
body {
font-family: Arial;
margin: 50px;
}
</style>
</head>
<body>
<p>Тест русского текста.</p>
<p>Если вы видите русский текст, то тест успешно пройден.</p>
</body>
</html>
Для запуска можно использовать примерно такую команду:
phantomjs rasterize.js http://crusat.ru/demos/fontface/index.html test.png
Это самое простое решение, что пришло мне в голову.