2015-12-08 7 views
12

Я бегу phantomjs в среде node.js, и все идет хорошо. На данный момент я просто использую локальные шрифты, но хочу получить google web fonts, работающий с phantomjs.phantomjs + веб-шрифты + загрузчик шрифтов

Существуют различные противоречивые и запутанные отчеты о том, можно ли создавать веб-шрифты для работы с phantomjs. Есть такие статьи, как this, которые содержат устаревшую информацию с мертвыми ссылками. И сообщения вроде this, которые предполагают, что phantomjs 2.0 будет или может поддерживать веб-шрифты, другие говорят, что это не 2.0.1 будет. В сообщении this есть предположение, что webfonts работают в 2.0.

Я пробовал множество опций, в том числе с phantomjs 2.0 и 2.0.1 двоичные файлы, но не могу заставить его работать. Может быть, что я загружаю веб-шрифты в моих JS с помощью web font loader используя что-то вдоль следующее:

WebFont.load({ 
    google: { 
     families: ['Droid Sans', 'Droid Serif'] 
    }, 
    loading: function() { console.log('loading'); }, 
    active: function() { 
     console.log('active'); 
     // hooray! can do stuff... 
    }, 
    inactive: function() { console.log('inactive'); }, 
    fontloading: function(familyName, fvd) { console.log('fontloading', familyName, fvd); }, 
    fontactive: function(familyName, fvd) { console.log('fontactive', familyName, fvd); }, 
    fontinactive: function(familyName, fvd) { console.log('fontinactive', familyName, fvd); } 
}); 

Но я всегда достигает inactive ветви, поэтому нагрузка шрифт никогда успешно ... ., даже если тот же код прекрасно работает в браузере (достижение active филиала

в font loader docs, он говорит:

Если Web Font Loader определяет, что текущий браузер не поддерживает @font-face, тыс e inactive Событие будет запущено.

Мои подозрения в том, что загрузчик веб-шрифт действительно определяют, что браузер (phantomjs) не поддерживает это, следовательно, всегда достигая inactive.

Кто-нибудь получил phantomjs + веб-шрифты + загрузчик веб-шрифтов?

ответ

4

Что вы хотите использовать? Я думаю, что Web Font Loader использует UA для обнаружения поддержки. Попробуйте UA из Chrome 46, а затем посмотрите, работает ли он.

var webPage = require('webpage'); 
var page = webPage.create(); 
page.settings.userAgent = 'Mozilla/5.0 (Windows NT 5.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/46.0.2490.86 Safari/537.36'; 
+0

К сожалению, нет никакой разницы :-(Пробовал это с phantomjs 1.9.8, 2.0.0 и 2.0.1 ... каждый раз, когда он достигает только «неактивной» ветки – drmrbrewer

+2

, я просто попробовал с [email protected], изменив нас erAgent. Журналы: 'loading',' active' .. – cviejo

+0

У вас есть какие-либо фрагменты кода для совместного использования @cviejo? Я до сих пор не могу добраться до 'активного 'филиала ... – drmrbrewer

2

Не помечено как правильно, просто расширяя вышеуказанный ответ. Поскольку все фантомные обертки (например, phridge и phantomjs-node) в основном порождают новый процесс phantomjs, результат должен быть одинаковым при запуске из контекста nodejs.

phatomjs-webfonts.html:

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title>PhantomJS WebFontsTest</title> 
</head> 
<body> 
<script src="https://ajax.googleapis.com/ajax/libs/webfont/1.5.18/webfont.js"></script> 
<script> 
    WebFont.load({ 
     google: { 
      families: ['Droid Sans', 'Droid Serif'] 
     }, 
     loading: function(){ console.log('WebFonts loading'); }, 
     active: function(){ console.log('WebFonts active'); }, 
     inactive: function(){ console.log('WebFonts inactive'); } 
    }); 
</script> 
</body> 
</html> 

phantomjs-Веб-шрифты.ЯШ:

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

page.settings.userAgent = 'Mozilla/5.0 (Windows NT 5.1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/46.0.2490.86 Safari/537.36'; 

page.onConsoleMessage = function(msg, lineNum, sourceId) { 
    console.log('Console: ' + msg); 
}; 

page.open('http://<server-address>/phantomjs-webfonts.html', function(status) { 
    console.log("Loading status: " + status); 
}); 

Команда:

phantomjs phantomjs-webfonts.js 

Выход:

Console: WebFonts loading 
Console: WebFonts active 
Loading status: success 
+0

Какая версия фантомов? '$ phantomjs -v' – drmrbrewer

+0

[email protected] – cviejo

+0

Я не знал, что был даже 1.9.19? См. Http://phantomjs.org/release-1.9.html. Или вы имеете в виду пакет phpmomjs npm https://www.npmjs.com/package/phantomjs, который в настоящее время имеет версию 1.9.19? – drmrbrewer