PhantomJS - Краткое руководство
PhantomJS считается headless browserпотому что при выполнении кода JavaScript не участвует браузер. Выполнение будет отображаться не в браузере, а в командной строке. Такие функции, какCSS Handling, DOM Manipulation, JSON, Ajax, Canvas, SVG,и т. д., все будет выполнено в командной строке. PhantomJS не имеет графического интерфейса и, следовательно, все его выполнение происходит в командной строке.
Используя PhantomJS, мы можем писать в файл, читать его содержимое или загружать файл, делать снимок экрана, конвертировать веб-страницу в PDF-файл и многое другое. С безголовыми браузерами вы получаете все поведение браузера, т.е.Cookies, Http Request Methods т.е. GET /POST, Clearing Cookies, Deleting Cookies, и т.д., Reloading of Page, Navigating to a Different Page.
PhantomJS использует WebKit, который имеет аналогичную среду просмотра, как и известные браузеры - Google Chrome, Mozilla Firefox, Safari и т. Д. Он также предоставляет множество JavaScript API, который помогает делать снимки экрана, загружать файл, записывать в файл, читать файл. , взаимодействие с веб-страницами и т. д.
PhantomJS не поддерживает Flash или Video, так как для него требуются плагины, и их сложно поддерживать в командной строке.
Особенности PhantomJS
Давайте теперь разберемся с функциями, которые предлагает PhantomJS.
Автоматизация страниц
PhantomJS позволяет читать содержимое страницы с помощью своего API. Это может помочь управлять DOM, использовать внешние библиотеки для выполнения требуемой задачи.
Скриншот
PhantomJS помогает сделать снимок экрана указанной страницы и сохранить то же самое, что и изображение, в различных форматах, таких как PNG, JPEG, PDF и GIF. С помощью снимка экрана можно легко убедиться, что веб-контент в порядке.
PhantomJS предлагает свойства и методы, с помощью которых он позволяет разработчикам настраивать размер снимков экрана и указывать область, которую они хотят захватить.
Безголовое тестирование
PhantomJS помогает тестировать пользовательский интерфейс из командной строки. А с помощью снимка экрана легко найти ошибки в пользовательском интерфейсе. PhantomJS иногда не может помочь с тестированием в одиночку. Однако его можно обернуть вместе с другими библиотеками тестирования, такими как Mocha, Yoeman и т. Д. Вы можете воспользоваться помощью PhantomJS, чтобы загрузить файл и отправить форму.
PhantomJS можно использовать для тестирования логинов на сайтах и проверки безопасности. PhantomJS можно использовать вместе с другими инструментами, такими какCasperJS, Mocha, Qunit чтобы сделать тестирование более мощным.
Сетевой мониторинг
Одной из важных особенностей PhantomJS является его использование для мониторинга сетевого подключения с помощью доступного API. PhantomJS позволяет проверять сетевой трафик; он подходит для построения различных анализов поведения и производительности сети.
PhantomJS можно использовать для сбора данных о производительности веб-страницы в реальной среде. PhantomJS можно использовать с такими инструментами, какYslow для сбора показателей производительности любых веб-сайтов.
PhantomJS - бесплатное программное обеспечение и распространяется под BSD License. Его легко установить, и он предлагает несколько функций для выполнения сценариев. PhantomJS можно легко запустить на нескольких платформах, таких как Windows, Linux и Mac.
Для загрузки PhantomJS вы можете перейти на - http://phantomjs.org/ а затем щелкните вариант загрузки.
Для Windows
На странице загрузки показаны варианты загрузки для различных ОС. Загрузите zip-файл, распакуйте его, и вы получите исполняемый файлphantom.exe. Задайте для переменной среды PATH путь к файлу phantom.exe. Откройте новую командную строку и введитеphantomjs –v. Он должен предоставить вам текущую версию PhantomJS, которая работает.
Для MAC OS X
Загрузите zip-файл PhantomJS, предназначенный для ОС MAC, и извлеките его содержимое. После загрузки содержимого переместите PhantomJS в -/usr/local/bin/. Выполните команду PhantomJS, т.е. phantomjs –v на терминале, и она должна дать вам описание версии PhantomJS.
Linux 64 бит
Загрузите zip-файл PhantomJS, предназначенный для 64-разрядной версии Linux, и извлеките его содержимое. После загрузки содержимого переместите папку PhantomJS в/usr/local/share/ и create a symlink -
sudo mv $PHANTOM_JS /usr/local/share sudo ln -sf /usr/local/share/$PHANTOM_JS/bin/phantomjs /usr/local/bin.
Выполните phantomjs –v на терминале, и он должен выдать версию PhantomJS.
Linux 32 бит
Загрузите zip-файл PhantomJS, предназначенный для 32-разрядной версии Linux, и извлеките его содержимое. После загрузки содержимого переместите папку PhantomJS в/usr/local/share/ и создайте символическую ссылку -
sudo mv $PHANTOM_JS /usr/local/share sudo ln -sf /usr/local/share/$PHANTOM_JS/bin/phantomjs /usr/local/bin.
Выполните phantomjs –v на терминале, и он должен выдать версию PhantomJS.
Исходный код PhantomJS также можно взять из репозитория git, щелкнув следующую ссылку - https://github.com/ariya/phantomjs/
Для запуска скриптов в PhantomJS используется следующая команда:
phantomjs jsfile arg1 arg2…
В этой главе мы рассмотрим четыре важных объекта PhantomJS. Они следующие -
- CookiesEnabled
- Cookies
- LibraryPath
- Version
Давайте теперь обсудим каждый из них подробно.
cookiesEnabled
Он сообщает, включены ли файлы cookie или нет. Он вернетсяtrue, Если да; иначеfalse.
Синтаксис
Его синтаксис следующий -
phantom.cookiesEnabled
пример
cookieenabled.js
phantom.addCookie ({
//adding cookie with addcookie property
name: 'c1',
value: '1',
domain: 'localhost'
});
console.log("Cookie Enabled value is : "+phantom.cookiesEnabled);
phantom.exit();
Вывод
Command - phantomjs cookieenabled.js
Cookie Enabled value is : true
Печенье
Это помогает добавлять и устанавливать файлы cookie в домен. Он возвращает объект со всеми файлами cookie, доступными для домена.
Синтаксис
Его синтаксис следующий -
phantom.cookies;
пример
Filename: phantomcookie.js
phantom.addCookie ({
name: 'c1',
value: '1',
domain: 'localhost'
});
phantom.addCookie ({
name: 'c2',
value: '2',
domain: 'localhost'
});
phantom.addCookie ({
name: 'c3',
value: '3',
domain: 'localhost'
});
console.log(JSON.stringify(phantom.cookies));
phantom.exit();
Вывод
Command - phantomjs phantomcookie.js
[{"domain":".localhost","httponly":false,"name":"c3","path":"/","secure":false, "
value":"3"},{"domain":".localhost","httponly":false,"name":"c2","path":"/","sec u
re":false,"value":"2"},{"domain":".localhost","httponly":false,"name":"c1","pat h
":"/","secure":false,"value":"1"}]
В приведенном выше примере мы добавили несколько файлов cookie в домен localhost. Затем мы получили его, используяphantom.cookies. Он возвращает объект со всеми файлами cookie, используяJSON stringifyдля преобразования объекта JavaScript в строку. Вы также можете использоватьforeach для доступа к имени / значениям файлов cookie.
LibraryPath
PhantomJS libraryPath хранит путь к сценарию, который будет использоваться injectJS метод.
Синтаксис
Его синтаксис следующий -
phantom.libraryPath
пример
Вот пример, чтобы узнать версию.
var webPage = require('webpage');
var page = webPage.create();
page.open('http://www.tutorialspoint.com/jquery', function(status) {
if (status === "success") {
page.includeJs('http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js ', function() {
if (page.injectJs('do.js')) {
// returnTitle is a function loaded from our do.js file - see below
return returnTitle();
});
console.log(title);
phantom.exit();
}
}
});
window.returnTitle = function() {
return document.title;
};
Вышеупомянутая программа генерирует следующие output.
Jquery Tutorial
Версия
Он дает версию PhantomJS, которая работает, и возвращает детали в объекте. Например: {"major": 2, "minor": 1, "patch": 1}
Синтаксис
Его синтаксис следующий -
phantom.version
пример
Вот пример, чтобы узнать версию.
var a = phantom.version;
console.log(JSON.stringify(a));
console.log(a.major);
console.log(a.minor);
console.log(a.patch);
phantom.exit();
Вышеупомянутая программа генерирует следующие output.
{"major":2,"minor":1,"patch":1}
2
1
1
В приведенном выше примере мы использовали console.logчтобы распечатать версию. В настоящее время мы работаем с версией 2. Она возвращает объект с подробностями, показанными в приведенном выше блоке кода.
PhantomJS - это платформа, помогающая выполнять JavaScript без браузера. Для этого используются следующие методы, которые помогают в добавлении cookie, удалении, очистке, выходе из скрипта, внедрении JS и т. Д.
Подробнее об этих методах PhantomJS и их синтаксисе мы поговорим в этой главе. Подобные методы, т.е.addcookie, injectjs существует в модуле веб-страницы, который будет обсуждаться в следующих главах.
PhantomJS предоставляет следующие методы, которые могут помочь нам выполнять JavaScript без браузера:
- addCookie
- clearCookie
- deleteCookie
- Exit
- InjectJS
Давайте теперь разберемся с этими методами подробно на примерах.
addCookie
Метод addcookie используется для добавления файлов cookie и сохранения данных. Это похоже на то, как браузер сохраняет это. Он принимает единственный аргумент, который является объектом со всеми свойствами файлов cookie, и его синтаксис выглядит так, как показано ниже:
Синтаксис
Его синтаксис следующий -
phantom.addCookie ({
"name" : "cookie_name",
"value" : "cookie_value",
"domain" : "localhost"
});
Имя, значение, домен - это обязательные свойства, которые нужно добавить в функцию addcookie. Если какое-либо из этих свойств отсутствует в объектах cookie, этот метод завершится ошибкой.
name - указывает имя файла cookie.
value - указывает значение используемого файла cookie.
domain - домен, к которому будет применяться cookie.
пример
Вот пример addcookie метод.
var page = require('webpage').create(),url = 'http://localhost/tasks/a.html';
page.open(url, function(status) {
if (status === 'success') {
phantom.addCookie({ //add name cookie1 with value = 1
name: 'cookie1',
value: '1',
domain: 'localhost'
});
phantom.addCookie({ // add cookie2 with value 2
name: 'cookie2',
value: '2',
domain: 'localhost'
});
phantom.addCookie({ // add cookie3 with value 3
name: 'cookie3',
value: '3',
domain: 'localhost'
});
console.log('Added 3 cookies');
console.log('Total cookies :'+phantom.cookies.length);
// will output the total cookies added to the url.
} else {
console.error('Cannot open file');
phantom.exit(1);
}
});
пример
a.html
<html>
<head>
<title>Welcome to phantomjs test page</title>
</head>
<body>
<h1>This is a test page</h1>
<h1>This is a test page</h1>
<h1>This is a test page</h1>
<h1>This is a test page</h1>
<h1>This is a test page</h1>
<h1>This is a test page</h1>
<h1>This is a test page</h1>
<h1>This is a test page</h1>
<h1>This is a test page</h1>
</body>
</html>
Вышеупомянутая программа генерирует следующие output.
Added 3 cookies
Total cookies :3
Комментарии к коду говорят сами за себя.
clearCookies
Этот метод позволяет удалить все файлы cookie.
Синтаксис
Его синтаксис следующий -
phantom.clearCookies();
Эта концепция работает аналогично удалению файлов cookie браузера путем выбора в меню браузера.
пример
Вот пример clearCookies метод.
var page = require('webpage').create(),url = 'http://localhost/tasks/a.html';
page.open(url, function(status) {
if (status === 'success') {
phantom.addCookie({ //add name cookie1 with value = 1
name: 'cookie1',
value: '1',
domain: 'localhost'
});
phantom.addCookie({ // add cookie2 with value 2
name: 'cookie2',
value: '2',
domain: 'localhost'
});
phantom.addCookie({ // add cookie3 with value 3
name: 'cookie3',
value: '3',
domain: 'localhost'
});
console.log('Added 3 cookies');
console.log('Total cookies :'+phantom.cookies.length);
phantom.clearCookies();
console.log(
'After clearcookies method total cookies :' +phantom.cookies.length);
phantom.exit();
} else {
console.error('Cannot open file');
phantom.exit(1);
}
});
a.html
<html>
<head>
<title>Welcome to phantomjs test page</title>
</head>
<body>
<h1>This is a test page</h1>
<h1>This is a test page</h1>
<h1>This is a test page</h1>
<h1>This is a test page</h1>
<h1>This is a test page</h1>
<h1>This is a test page</h1>
<h1>This is a test page</h1>
<h1>This is a test page</h1>
<h1>This is a test page</h1>
</body>
</html>
Вышеупомянутая программа генерирует следующие output.
Added 3 cookies
Total cookies :3
After clearcookies method total cookies :0
deleteCookie
Удалите все файлы cookie в CookieJarсо свойством name, соответствующим cookieName. Он вернетсяtrue, в случае успешного удаления; иначеfalse.
Синтаксис
Его синтаксис следующий -
phantom.deleteCookie(cookiename);
Дай нам понять addcookie, clearcookies и deletecookie с помощью примера.
пример
Вот пример, демонстрирующий использование метода deleteCookie -
File: cookie.js
var page = require('webpage').create(),url = 'http://localhost/tasks/a.html';
page.open(url, function(status) {
if (status === 'success') {
phantom.addCookie({ //add name cookie1 with value = 1
name: 'cookie1',
value: '1',
domain: 'localhost'
});
phantom.addCookie({ // add cookie2 with value 2
name: 'cookie2',
value: '2',
domain: 'localhost'
});
phantom.addCookie({ // add cookie3 with value 3
name: 'cookie3',
value: '3',
domain: 'localhost'
});
console.log('Added 3 cookies');
console.log('Total cookies :'+phantom.cookies.length);
//will output the total cookies added to the url.
console.log("Deleting cookie2");
phantom.deleteCookie('cookie2');
console.log('Total cookies :'+phantom.cookies.length);
phantom.clearCookies();
console.log(
'After clearcookies method total cookies :' +phantom.cookies.length);
phantom.exit();
} else {
console.error('Cannot open file');
phantom.exit(1);
}
});
Вышеупомянутая программа генерирует следующие output.
phantomjs cookie.js
Added 3 cookies
Total cookies :3
Deleting cookie2
Total cookies :2
After clearcookies method total cookies :0
Выход
Метод phantom.exit завершит запуск сценария. Он выходит из программы с указанным возвращаемым значением. Это дает‘0’, если значение не передано.
Синтаксис
Его синтаксис следующий -
phantom.exit(value);
Если вы не добавите phantom.exit, то в командной строке предполагается, что выполнение все еще продолжается и не завершится.
пример
Давайте посмотрим на пример, чтобы понять использование exit метод.
console.log('Welcome to phantomJs'); // outputs Welcome to phantomJS
var a = 1;
if (a === 1) {
console.log('Exit 1'); //outputs Exit 1
phantom.exit(); // Code exits.
} else {
console.log('Exit 2');
phantom.exit(1);
}
Вышеупомянутая программа генерирует следующие output.
phantomjs exit.js
Welcome to phantomJs
Exit 1
Любой фрагмент кода после phantom.exit не будет выполнен, поскольку phantom.exit - это метод завершения скрипта.
injectJs
InjectJs используется для добавления addtionaljsфайлы в фантоме. Если файл не найден в текущемdirectory librarypath, то свойство phantom (phantom.libraryPath) используется как дополнительное место для отслеживания пути. Он возвращаетсяtrue если добавление файла прошло успешно, иначе false в случае сбоя, если он не может найти файл.
Синтаксис
Его синтаксис следующий -
phantom.injectJs(filename);
пример
Давайте посмотрим на следующий пример, чтобы понять использование injectJs.
Filename: inject.js
console.log(“Added file”);
File name: addfile.js
var addfile = injectJs(inject.js);
console.log(addfile);
phantom.exit();
Вывод
Command - C: \ phantomjs \ bin> phantomjs addfile.js
Added file // coming from inject.js
true
В приведенном выше примере addfile.js вызывает файл inject.jsиспользуя injectJs. Когда вы выполняете addfile.js, в выходных данных отображается console.log в inject.js. Он также показывает true для переменной addfile, поскольку файл inject.js был успешно добавлен.
PhantomJS предоставляет довольно много свойств и методов, которые помогают нам взаимодействовать с содержимым внутри веб-страницы.
Команда require ("webpage"). Create () создает объект веб-страницы. Мы будем использовать этот объект для управления веб-страницей с помощью свойств и методов, перечисленных ниже.
var wpage = require("webpage").create();
В следующей таблице содержится список всех свойств веб-страницы, которые мы собираемся обсудить.
S.No | Свойства и описание |
---|---|
1 | canGoBack Это свойство возвращает trueесли в истории переходов есть предыдущая страница; если не,false. |
2 | canGoForward Это свойство возвращает истину, если в истории переходов есть следующая страница; если не,false. |
3 | clipRect clipRect - это объект со значениями top, left, width и height, используемый для захвата изображения веб-страницы при использовании его методом render (). |
4 | Содержание Это свойство содержит содержимое веб-страницы. |
5 | печенье С помощью файлов cookie вы можете установить / получить файлы cookie, доступные по URL-адресу. Он также предоставит вам файлы cookie, доступные по URL-адресу, и новые файлы cookie, установленные на странице. |
6 | customHeaders customHeaders указывает дополнительные заголовки HTTP-запросов, которые будут отправляться на сервер для каждого запроса, отправляемого страницей. |
7 | Событие Он дает длинный список событий, т.е. модификатор, детали ключей. |
8 | focusFrameName Возвращает имя текущего кадра в фокусе. |
9 | frameContent Это свойство дает содержимое активного фрейма. |
10 | frameName Возвращает имя текущего кадра в фокусе. |
11 | framePlainText Это свойство также дает содержимое текущего активного фрейма, но только содержимое без каких-либо тегов html. |
12 | frameTitle Дает название активного фрейма. |
13 | frameUrl Это свойство даст URL-адрес текущего фрейма. |
14 | framesCount Дает количество кадров, присутствующих на странице. |
15 | framesName Дает массив имен фреймов. |
16 | libraryPath Это свойство имеет путь, который используется методом page.inectJs. |
17 | навигация заблокирована Это свойство определяет, разрешена ли навигация по странице. Если true, то это будет URL-адрес текущей страницы, и нажатие на страницу для перехода на следующую страницу будет запрещено. |
18 | offlineStoragePath Это свойство указывает путь, по которому хранятся данные, с помощью window.localStorage. Путь можно изменить с помощью --local-storage-path из командной строки. |
19 | offlineStorageQuota Это свойство определяет максимальный объем данных, который вы можете хранить в window.localStorage. Значение составляет 5242880 байт, что составляет 5 МБ. Это значение можно перезаписать в командной строке с помощью следующей команды --localstorage-quota = size здесь. |
20 | ownPages ownsPages возвращает true или false, если страница, открытая веб-страницей, является ее дочерней. |
21 год | pagesWindowName PagesWindowName даст имена открытых окон, используя window.open |
22 | страницы Свойство pages предоставит вам массив страниц, открытых на странице с помощью window.open. Если страница закрыта по URL-адресу, ссылающаяся на вас страница не будет рассматриваться. |
23 | размер бумаги Это свойство дает размер, то есть размеры веб-страницы, когда необходимо использовать ее для преобразования веб-страницы в формат pdf. PaperSize содержит размеры, требуемые для объекта. |
24 | простой текст Это свойство также дает содержимое текущего активного фрейма, но только содержимое без каких-либо тегов html. |
25 | scrollPosition Он содержит объект, указывающий позицию прокрутки. Дает слева и сверху. |
26 | настройки Это свойство предоставит настройки веб-страницы при использовании метода page.open. После загрузки страницы изменения в свойствах настроек не окажут никакого влияния. |
27 | заглавие Это свойство даст вам название страницы, которую вы читаете. |
28 | url Это свойство предоставит URL-адрес страницы. |
29 | viewportSize Это свойство позволяет изменять размер отображения окна. Он содержит ширину и высоту, которые вы можете прочитать или изменить в соответствии с потребностями. |
30 | windowName Дает имя окна. |
31 год | zoomFactor Это свойство определяет коэффициент масштабирования для методов render и renderBase64. Это помогает увеличить страницу и при необходимости сделать снимок экрана. |
В модуле веб-страницы есть методы для Cookies, Frames, Page Navigation, Reload, Rendering и Uploading of Files.
Ниже приведены методы, доступные на веб-странице.
S.No | Методы и описание |
---|---|
1 | addCookie () addCookie добавляет файлы cookie на указанную страницу. |
2 | childFramesCount() Этот метод устарел согласно http://phantomjs.org. |
3 | childFramesName() Этот метод устарел согласно http://phantomjs.org. |
4 | clearCookies () Удалит все файлы cookie для указанной страницы. |
5 | Закрыть() Этот метод используется для закрытия страницы и освобождения используемой памяти. Ни один из методов или свойств веб-страницы не будет работать после вызова закрытия. |
6 | currentFrameName() Этот метод устарел согласно http://phantomjs.org. |
7 | deleteCookie () Это приведет к удалению файла cookie с именем, соответствующим существующему списку файлов cookie, присутствующих для данного URL-адреса страницы. |
8 | оценитьAsync () Асинхронно оценивать данную функцию на странице, не блокируя текущее выполнение. Эта функция помогает выполнять определенные сценарии асинхронно. |
9 | оценитьJavascript () EvaluateJavaScript помогает выполнить переданную ему функцию в виде строки. Обратите внимание, что переданная строка должна быть только функцией. |
10 | оценить () Evaluate выполнит переданную ему функцию. Если функция содержит сообщения консоли, она не отображается непосредственно в терминале. Для отображения любых консольных сообщений вам необходимо использовать фантомный обратный вызов onConsoleMessage. |
11 | getPage () Это даст вам дочернюю страницу, которая соответствует имени ветра, переданному в getpage. |
12 | Вернись() Выдает предыдущую страницу в истории навигации, если только навигация не заблокирована. |
13 | иди вперед() Выдает следующую страницу в истории навигации, если только навигация не заблокирована. |
14 | идти() Этот метод позволяет вам перемещаться по страницам. |
15 | includeJs () Includejs выполняет внешний файл JS на странице и по завершении выполняет функцию обратного вызова. |
16 | injectJs () InjectJs включает внешний скрипт из указанного файла на страницу. Если файл недоступен в текущем каталоге, то он использовал libraryPath для дополнительного поиска файла. Он возвращает true, если файл внедрен, иначе false. |
17 | openUrl () OpenUrl открывает веб-страницу. Он похож на открытый метод PhantomJS. OpenUrl имеет некоторые дополнительные параметры, а именно httpConf, настройки и функции обратного вызова. |
18 | открытый() Открыть используется для открытия веб-страницы. |
19 | выпуск() Release освободит использование кучи памяти для страницы. Не используйте методы экземпляра страницы после вызова выпуска. Этот метод похож на метод close, и его использование не рекомендуется. Вместо этого используйте wpage.close (). |
20 | перезагрузить () Reload используется для перезагрузки текущей используемой страницы. |
21 год | renderBase64 () Этот метод берет снимок экрана и выдает изображение в виде строки в base46. Renderbase64 поддерживает такие форматы, как PNG, JPEG и JPG. На данный момент он не поддерживает гифки. Вы можете использовать свойство clipRect, чтобы определить часть для захвата изображения. |
22 | renderBuffer () RenderBuffer переносит захват веб-страницы в буфер изображения, который можно напрямую отправить на сервер. Поддерживаемые форматы: PNG, GIF и JPEG. |
23 | render () Render помогает взять буфер изображения и сохранить его в соответствии с указанным форматом. |
24 | sendEvent () Он используется для отправки события на веб-страницу. Это не домашние события. Каждое из этих событий отправляется на веб-страницу в зависимости от взаимодействия с пользователем. |
25 | setContent () setcontent изменит содержимое страницы указанного URL на указанное содержимое. |
26 | стоп() Это помогает остановить загрузку страницы. |
27 | switchToChildFrame() Использование switchToFrame () не рекомендуется; |
28 | switchToFocusedFrame () Он выбирает кадр, который находится в фокусе. |
29 | switchToFrame () Выбирает фрейм с указанным именем, который является дочерним по отношению к текущему фрейму. |
30 | switchToMainFrame () Выбирает мэйнфрейм, т.е. корневое окно. |
31 год | switchToParentFrame () Принимает родительский фрейм текущего дочернего фрейма. |
32 | загрузить файл() Этот метод используется для обработки загрузки файла, выполненного с использованием формы в формате html. PhantomJS не имеет прямого способа сделать это с помощью форм, то же самое можно сделать с помощью метода uploadFile. Он принимает селектор тегов html для местоположения файла и места назначения, куда он должен быть скопирован. |
Обратные вызовы, доступные в модуле веб-страницы, описаны в следующей таблице.
S.No | Обратные вызовы и описание |
---|---|
1 | onAlert () Этот обратный вызов вызывается, когда на странице есть предупреждение; обратный вызов принимает строку и ничего не возвращает. |
2 | onCallback () OnCallback используется для передачи значений с веб-страницы на объект веб-страницы, и это выполняется с помощью метода window.callPhantom (), который внутренне вызывает функцию onCallback. |
3 | onClosing () Это вызывается, когда окно закрывается с помощью метода page.close () или метода window.close (). |
4 | onConfirm () Этот обратный вызов вызывается, когда есть подтвержденное сообщение, вызываемое с помощью команды ok / cancel со страницы. |
5 | onConsoleMessage () Этот обратный вызов используется, когда на веб-странице используются сообщения консоли. Метод onConsoleMessage принимает 3 аргумента. |
6 | onError () Он вызывается при возникновении ошибки JavaScript. Аргументы для onError - это сообщение и трассировка стека, которая представляет собой массив. |
7 | onFilePicker () Это используется для загрузки файла, обратный вызов вызывается, когда пользователь хочет загрузить файл. |
8 | onInitialized () Этот обратный вызов вызывается при вызове страницы перед загрузкой. |
9 | onLoadFinished () Эта функция вызывается, когда открытая страница полностью загружена. У него есть один аргумент, который сообщает, была ли загрузка успешной или неудачной. |
10 | onLoadStarted () Этот обратный вызов вызывается, когда страница начинает загружаться. |
11 | onNavigationRequested () Этот обратный вызов сообщает, когда происходит событие навигации. |
12 | onPageCreated () Этот обратный вызов вызывается, когда на странице открывается новое дочернее окно. |
13 | onPrompt () Этот обратный вызов вызывается, когда веб-страница вызывает приглашение. Требуется 2 аргумента, сообщение и ответ. Возвращаемое значение - строка. |
14 | onResourceError () Этот обратный вызов вызывается, когда веб-страница не может загрузить файл. |
15 | onResourceReceived () Этот обратный вызов вызывается при получении ресурса, запрошенного страницей. |
16 | onResourceRequested () Эта функция вызывается, когда страница запрашивает ресурс. |
17 | onResourceTimeout () Этот обратный вызов вызывается, когда время ожидания запрашиваемого ресурса истекает, когда используется settings.resourceTimeout. |
18 | onUrlChanged () Это вызывается, когда URL-адрес изменяется с текущего с помощью навигации. У него есть один аргумент для обратного вызова, который представляет собой новую строку URL targetUrl. |
Модуль процесса Phantomjs Child помогает взаимодействовать с подпроцессами и общаться с ними, используя stdin /stdout/stderr. Дочерние процессы могут использоваться для таких задач, какprinting, sending mail или чтобы invoke programsнаписано на другом языке. Чтобы создать модуль дочернего процесса, вам понадобятся ссылки.
Например -
var process = require("child_process");
Метод спауна
С помощью дочернего процесса spawn вы можете подписаться на его stdout и stderr потоки для получения данных в реальном времени.
Синтаксис
Его синтаксис следующий -
var spawn = require('child_process').spawn;
пример
Давайте посмотрим на пример метода спауна.
var process = require("child_process")
var spawn = process.spawn
var child = spawn("cmd", ['/c', 'dir']);
child.stdout.on("data", function (data) {
console.log("spawnSTDOUT---VALUE:", JSON.stringify(data))
})
child.stderr.on("data", function (data) {
console.log("spawnSTDERR:", JSON.stringify(data))
})
child.on("exit", function (code) {
console.log("spawnEXIT:", code)
})
Вывод
Вышеупомянутая программа генерирует следующий вывод.
spawnSTDOUT---VALUE: " Volume in drive C is OS\r\n"
spawnSTDOUT---VALUE: " Volume Serial Number is 7682-9C1B\r\n\r\n Directory of C:
\\phantomjs\\bin\r\n\r\n"
spawnSTDOUT---VALUE: "20-05-2017 10:01
<DIR> .\r\n20-05-2017 10:01
<DIR> ..\r\n13-05-2017 20:48 12 a,txt.txt\r\n07-05-2017 08:51
63 a.js\r\n06-05-2017 16:32 120,232 a.pdf\r\n13-05-2017 20:49
spawnEXIT: 0
Модуль файловой системы имеет множество API для работы с файлами и каталогами. Вы можете создавать / записывать и удалять файл / каталог. Чтобы начать использовать модуль файловой системы, вам потребуется ссылка наfs module.
var fs = require('fs');
Для модуля файловой системы доступны два свойства: Separator и Working Directory. Давайте разберемся с ними подробнее.
Разделитель
Он сообщает вам разделитель, используемый для путей к файлам.
- Для окон:\
- Для Linux: /
Синтаксис
Его синтаксис следующий -
fs.seperator
пример
var fs = require('fs');
console.log(fs.seperator);
phantom.exit();
Вышеупомянутая программа генерирует следующие output.
undefined
рабочий каталог
Рабочий каталог - это каталог, в котором выполняется PhantomJS.
Синтаксис
Его синтаксис следующий -
var fs = require('fs');
fs.workingDirectory;
пример
var fs = require('fs');
console.log(fs.workingDirectory);
phantom.exit();
Вышеупомянутая программа генерирует следующие output.
C:/phantomjs/bin
В следующей таблице приведены все методы и их описания, доступные в модуле файловой системы.
S.No | Методы и описание |
---|---|
1 | абсолютный Этот метод дает абсолютный путь, по которому запускается PhantomJS. |
2 | changeWorkingDirectory Это позволяет вам изменить рабочий каталог и возвращает true, в противном случае возвращает false. |
3 | copyTree copyTree скопирует каталог с одного пути на другой. Первый параметр - это исходная папка, а второй параметр - это папка назначения. |
4 | копировать Этот метод помогает скопировать файл из одного места в другое. Требуется два параметра. Первый параметр - это исходный файл, а второй параметр - это путь к файлу, куда он должен быть скопирован. Он выдаст ошибку, если исходный или целевой файл не существует. |
5 | существует Он проверяет, существует ли указанный путь к файлу в системе. Возвращает истину, если присутствует, в противном случае - ложь. |
6 | isAbsolute Этот метод вернет истину, если путь к файлу абсолютный, и ложь, если относительный. |
7 | isDirectory isDirectory сообщает, является ли данный файл каталогом или нет. Он возвращает истину, если каталог иначе ложь. Выдает false в случае, если данный путь не существует. |
8 | isExecutable Этот метод покажет, является ли данный файл исполняемым или нет. Возвращает истину, если исполняемый файл, иначе ложь. |
9 | isFile Это дает подробную информацию о том, является ли указанный путь файлом или нет. Он возвращает true, если это файл, и false, если это не так. |
10 | isLink Это даст вам истину, если путь к файлу является символической ссылкой, в противном случае - ложь. |
11 | isReadable Он проверяет, доступен ли данный файл для чтения или нет. Он дает истину, если да, и ложь, если нет. |
12 | isWritable Он сообщает, доступен ли данный файл для записи. Если да, возвращает true, в противном случае - false. |
13 | Последнее изменение Предоставляет подробную информацию о последней модификации файла. Он сообщает дату и время последнего изменения файла. |
14 | список Он дает все файлы, присутствующие в каталоге. |
15 | makeDirectory Создает новый каталог. |
16 | makeTree makeTree создает все необходимые папки, чтобы иметь возможность формировать окончательные каталоги. Это вернет true, если создание прошло успешно, иначе false. Если каталог уже существует, он вернет true. |
17 | переехать Он переместит файл с одного пути на другой. |
18 | открытый Он используется для открытия файла. |
19 | readLink Это вернет абсолютный путь к файлу или папке, на которую указывает символическая ссылка (или ярлык в Windows). Если путь не является символической ссылкой или ярлыком, он вернет пустую строку. |
20 | читать Это прочитает данный файл. |
21 год | removeDirectory Это удалит данный каталог. |
22 | removeTree Он удалит все файлы и папки из данной папки и, наконец, удалит саму папку. Если при выполнении этого процесса возникнет какая-либо ошибка, он выдаст ошибку «Невозможно удалить PATH из дерева каталогов» и зависнет. |
23 | удалять Удаляет данный файл. |
24 | размер Он дает размер файла. |
25 | прикоснуться Создает заданный файл. |
26 | записывать Записывает в указанный файл. |
В этой главе мы обсудим различные свойства системного модуля PhantomJS.
аргументы
Системный модуль PhantomJS имеет различные свойства, которые помогают передавать аргументы, узнавать исполняемый файл и т. Д.
Свойство args в основном возвращает аргументы, переданные в командной строке. Вы также можете передать URL-адрес страницы, которую хотите прочитать. Если вы хотите сохранить pdf-файл снимка экрана или загрузить файл, подробности можно передать в командную строку и прочитать с помощьюargs свойство.
Давайте найдем длину и способ получить каждый аргумент, переданный в командную строку.
Синтаксис
Его синтаксис следующий -
var system = require('system');
system.args;
пример
Взгляните на следующий пример, чтобы понять, как работает это свойство.
var system = require('system');
console.log(system.args.length);
if (system.args.length>0) {
console.log(JSON.stringify(system.args));
}
phantom.exit();
Вышеупомянутая программа генерирует следующие output.
Command - phantomsjs args.js http://localhost/tasks/request.html
2
["args.js","http://localhost/tasks/request.html"]
Первое значение - это имя файла, а следующее значение - переданный URL. Вы можете передать больше аргументов в командной строке и получить их, используяsystem.args.
env
В env свойство возвращает сведения о системе.
Синтаксис
Его синтаксис следующий -
var system = require('system');
system.env;
пример
var system = require('system');
console.log(JSON.stringify(system.env));
phantom.exit();
Вышеупомянутая программа генерирует следующий вывод.
{"=::":"::\\","=C:":"C:\\phantomjs\\bin","=ExitCode":"00000000","ALLUSERSPROFILE":
"C:\\ProgramData","APPDATA":"C:\\Users\\UserName\\AppData\\Roaming","COMPUTERNAME":
"X","ComSpec":"C:\\Windows\\system32\\cmd.exe","CommonProgramFiles":
"C:\\Program Files (x86)\\Common Files","CommonProgramFiles(x86)":
"C:\\Program Files (x86)\\Common Files","CommonProgramW6432":
"C:\\Program Files\\Common Files","FP_NO_HOST_CHECK":"NO","HOMEDRIVE":"C:",
"HOMEPATH":"\\Users\\UserName","LOCALAPPDATA":
"C:\\Users\\UserName\\AppData\\Local","LOGONSERVER":"\\\\MicrosoftAccount",
"NUMBER_OF_PROCESSORS":"2","OS":"Windows_NT","PATHEXT":".COM;.EXE;.BAT;.CMD;.VBS ;
.VBE;.JS;.JSE;.WSF;.WSH;.MSC","PROCESSOR_ARCHITECTURE":"x86","PROCESSOR_ARCHITEW64 32":
"AMD64","PROCESSOR_IDENTIFIER":"Intel64 Family 6 Model 58Stepping9,GenuineIntel",
"PROCESSOR_LEVEL":"6","PROCESSOR_REVISION":"3a09","PROMPT":
"$P$G","PSModulePath":"C:\\Windows\\system32\\WindowsPowerShell\\v1.0\\
Modules\\" ,"PUBLIC":"C:\\Users\\Public","Path":
"C:\\Program Files\\Dell\\DW WLAN Card;
c:\\Program Files (x86)\\Intel\\iCLS Client\\;c:\\Program Files\\Intel\\iCLSClient\\;
C:\\Windows\\system32;C:\\Windows;C:\\Windows\\System32\ \Wbem;
C:\\Windows\\System32\\WindowsPowerShell\\v1.0\\;
C:\\Program Files\\Intel\\Intel(R) Management Engine Components\\DAL;
C:\\Program Files\\Intel\\Intel(R) Management Engine Components\\IPT;
C:\\Program Files (x86)\\Intel\\Intel(R) Management Engine Components\\DAL;
C:\\Program Files (x86)\\Intel\\Intel(R)
ManagementEngineComponents\\IPT;c:\\ProgramFiles\\WIDCOMM\\BluetoothSoftware\\;
c:\\ProgramFiles\\WIDCOMM\\BluetoothSoftware\\syswow64;
C:\\ProgramFiles(x86)\\WindowsLive\\Shared;C:\\ProgramFiles\\nodejs\\;
C:\\ProgramFiles\\Git\\cmd;C:\\ProgramFiles\\ OpenVPN\\bin;
C:\\ProgramFiles(x86)\\Skype\\Phone\\;C:\\Users\\UserName\\AppData\\Roaming
\\npm","ProgramData":
"C:\\ProgramData","ProgramFiles":"C:\\ProgramFiles(x86)",
"ProgramFiles(x86)":"C:\\ProgramFiles(x86)","ProgramW6432":
"C:\\ProgramFiles","SESSIONNAME":"Console","SystemDrive":
"C:","SystemRoot":"C:\\Windows","TEMP":"C:\\Users\ \Username~1\\AppData\\Local\\Temp",
"TMP":"C:\\Users\\Username~1\\AppData\\Local\\Temp",
"USERDOMAIN":"USER","USERDOMAIN_ROAMINGPROFILE":"USER","USERNAME":"X Y","USERPROFILE":
"C:\\Users\\X Y","windir":"C:\\Windows"}
Операционные системы
Он возвращает сведения об используемой операционной системе. Он возвращает объект с архитектурой, названием ОС и версией.
Синтаксис
Его синтаксис следующий -
var system = require('system');
system.os;
пример
var system = require('system');
console.log(JSON.stringify(system.os));
phantom.exit();
Вышеупомянутая программа генерирует следующий вывод.
{"architecture":"32bit","name":"windows","version":"8.1"}
пид
Это свойство возвращает идентификатор процесса.
Синтаксис
Его синтаксис следующий -
var system = require('system');
system.pid;
пример
Давайте посмотрим на пример pid свойство.
var system = require('system');
console.log(system.pid);
phantom.exit();
Вышеупомянутая программа генерирует следующий вывод.
2160
Платформа
Это свойство возвращает платформу, над которой мы работаем.
Синтаксис
Его синтаксис следующий -
var system = require('system');
system.platform;
пример
var system = require('system');
console.log(system.platform);
phantom.exit();
Вышеупомянутая программа генерирует следующий вывод.
Phantomjs
PhantomJS использует встроенный веб-сервер под названием mongoose. Прямо сейчас PhantomJS не может подключиться ни к одному другому производственному веб-серверу. Что касается подключения, он может обрабатывать 10 подключений одновременно, и более 10 запросов будут ожидать в очереди.
Чтобы запустить веб-сервер, нам нужно использовать следующий синтаксис -
var webserver = require (‘webserver’);
Позвольте нам понять Port свойство, которое используется для прослушивания запросов, отправляемых на веб-сервер.
порт
Свойство Port для веб-сервера используется для прослушивания отправляемого ему запроса.
Синтаксис
Его синтаксис следующий -
var server = require('webserver').create();
var listening = server.listen(port, function (request, response) {});
пример
Давайте рассмотрим пример, чтобы понять, как port собственность работает.
var webserver = require('webserver');
var server = webserver.create();
var service = server.listen(8080,function(request,response){
});
if(service) console.log("server started - http://localhost:" + server.port);
Вышеупомянутая программа генерирует следующий вывод.
server started - http://localhost:8080
В этой главе мы обсудим различные методы модуля веб-сервера PhantomJS.
Закрыть
В close используется для закрытия веб-сервера.
Синтаксис
Его синтаксис следующий -
var server = require('webserver').create();
server.close();
пример
В следующем примере показано, как можно использовать close метод.
var webserver = require('webserver');
var server = webserver.create();
var service = server.listen(8080,function(request,response){
});
if(service) console.log("server started - http://localhost:" + server.port);
console.log(server.port);
server.close();
console.log(server.port);
Вышеупомянутая программа генерирует следующие output.
server started - http://localhost:8080
8080
Здесь мы утешили server.portпосле закрытия сервера. Следовательно, он не ответит, поскольку веб-сервер уже закрыт.
Слушать
В server.listen Метод принимает порт и функцию обратного вызова с двумя аргументами, которые: Request Object и Response Object.
В Request Object содержит следующие свойства -
Method - Это определяет метод GET / POST.
URL - Отображает запрошенный URL.
httpVersion - Здесь отображается фактическая версия http.
Headers - Это отображает все заголовки с парами ключ-значение.
Post - Тело запроса применимо только для метода post.
postRaw - Если заголовок Content-Type установлен на 'application / x-www-formurlencoded', исходное содержимое сообщения будет сохранено в этом дополнительном свойстве (postRaw), а затем это сообщение будет автоматически обновлено версией с декодированием URL. данных.
В Response Object содержит следующие свойства -
Headers- Имеет все заголовки HTTP как пары "ключ-значение". Его следует установить перед первым вызовом записи.
SetHeader - Устанавливает определенный заголовок.
Header (name) - Возвращает значение данного заголовка.
StatusCode - Устанавливает возвращаемый код статуса HTTP.
SetEncoding (encoding)- Используется для преобразования данных, переданных в write (). По умолчанию данные будут преобразованы в UTF-8. Укажите "двоичный", если данные представляют собой двоичную строку. Не требуется, если данные являются буфером (например, из page.renderBuffer).
Write (data)- Отправляет данные для тела ответа. Можно вызывать несколько раз.
WriteHead (statusCode, headers)- Отправляет заголовок ответа на запрос. Код состояния представляет собой трехзначный код состояния HTTP (например, 404). Последние аргументы и заголовки - это заголовки ответа.
Close - Он закрывает http-соединение.
CloseGracefully - Он похож на close (), но проверяет, что заголовки ответа были отправлены первыми.
Синтаксис
Его синтаксис следующий -
var server = require('webserver').create();
var listening = server.listen(8080, function (request, response) {}
пример
Давайте рассмотрим пример, чтобы понять, как listen метод работает.
var page = require('webpage').create();
var server = require('webserver').create();
var port = 8080;
var listening = server.listen(8080, function (request, response) {
console.log("GOT HTTP REQUEST");
console.log(JSON.stringify(request, null, 4));
// we set the headers here
response.statusCode = 200;
response.headers = {"Cache": "no-cache", "Content-Type": "text/html"};
// the headers above will now be sent implictly
// now we write the body
response.write("<html><head><title>Welcone to Phantomjs</title></head>");
response.write("<body><p>Hello World</p></body></html>");
response.close();
});
if (!listening) {
console.log("could not create web server listening on port " + port);
phantom.exit();
}
var url = "http://localhost:" + port + "/foo/response.php";
console.log("sending request to :" +url);
page.open(url, function (status) {
if (status !== 'success') {
console.log('page not opening');
} else {
console.log("Getting response from the server:");
console.log(page.content);
}
phantom.exit();
});
Вышеупомянутая программа генерирует следующие output.
sending request to :http://localhost:8080/foo/response.php
GOT HTTP REQUEST {
"headers": {
"Accept": "text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8",
"Accept-Encoding": "gzip, deflate",
"Accept-Language": "en-IN,*",
"Connection": "Keep-Alive",
"Host": "localhost:8080",
"User-Agent": "Mozilla/5.0 (Windows NT 6.2; WOW64) AppleWebKit/538.1
(KHTML, like Gecko) PhantomJS/2.1.1 Safari/538.1"
},
"httpVersion": "1.1",
"method": "GET",
"url": "/foo/response.php"
}
Getting response from the server:
<html><head><title>Welcone to Phantomjs</title></head><body><p>Hello World</p></body>
</html>
PhantomJS может быть запущен с использованием ключевого слова phantomjs и имени файла. Например, "phantomjs file.js".
Вы также можете передать аргументы в "file.js" следующим образом:
phantomjs [options] file.js arg1 arg2 ...
Давайте рассмотрим некоторые параметры, доступные в командной строке.
S.No | Вариант и описание |
---|---|
1 | --help or –h Отобразит все параметры командной строки. Немедленно останавливается и не запускает пройденный скрипт. |
2 | --version or –v Печатает версию запущенного PhantomJS. Это остановит выполнение сценария, который нужно запустить. |
3 | --debug[true|false] Печатает предупреждения и сообщения отладки. По умолчанию установлено значение false. Вы также можете использовать [да | нет]. |
4 | --cookies-file = /path/to/cookies.txt Имя файла для хранения постоянных файлов cookie. |
5 | --diskcache=[true|false] Включает кеширование диска. Он также принимает значения [да | нет] |
6 | --disk-cahe-path Путь для дискового кеша. |
7 | --ignore-sslerrors=[true|false] Игнорировать ошибки SSL. Например - просроченный или ошибки самозаверяющего сертификата. По умолчанию - false. Он также принимает значения [да | нет]. |
8 | --loadimages=[true|false] Загружает все встроенные изображения. Значение по умолчанию - истина. Также требуется [да | нет]. |
9 | --local-storagepath=/some/path Путь для сохранения содержимого LocalStorage и содержимого WebSQL. |
10 | --local-storagequota=number Максимальный размер для данных. |
11 | --local-url-access Разрешает использование URL-адресов 'file: ///' (по умолчанию true). |
12 | --local-to-remote-urlaccess=[true|false] Позволяет локальному контенту получить доступ к удаленному URL-адресу. По умолчанию - false. Он также принимает значения [да | нет]. |
13 | --max-disk-cachesize=size Ограничивает размер дискового кеша (в КБ) |
14 | --offline-storage-path Задает расположение автономного хранилища. |
15 | --offline-storage-quota Устанавливает максимальный размер автономного хранилища в КБ. |
16 | --outputencoding=encoding Устанавливает кодировку, используемую для вывода на терминал. По умолчанию - utf-8. |
17 | --proxy=address:port Указывает используемый прокси-сервер (например, proxy = 192.168.1.1: 8080) |
18 | --proxytype=[http|socks5|none] Указывает тип прокси-сервера (по умолчанию http) |
19 | --proxy-auth Информация для аутентификации для прокси. Например - --proxy-auth = имя пользователя: пароль |
20 | --scriptencoding=encoding Устанавливает кодировку, используемую для скрипта. По умолчанию - utf8. |
21 год | --script-language Устанавливает язык сценария. |
PhantomJS очень помогает сделать снимок экрана веб-страницы и преобразовать веб-страницу в PDF. Мы привели здесь простой пример, чтобы продемонстрировать, как это работает.
пример
var page = require('webpage').create();
page.open('http://phantom.org/',function(status){
page.render('phantom.png');
phantom.exit();
});
Выполните указанную выше программу, и результат будет сохранен как phantom.png.
Преобразование веб-страниц в PDF
PhantomJS также помогает конвертировать веб-страницы в PDF-файлы с добавлением верхнего и нижнего колонтитула. Взгляните на следующий пример, чтобы понять, как это работает.
var wpage = require('webpage').create();
var url = "https://en.wikipedia.org/wiki/Main_Page";
var output = "test.pdf";
wpage.paperSize = {
width: screen.width+'px',
height: '1500px',
margin: {
'top':'50px',
'left':'50px',
'rigtht':'50px'
},
orientation:'portrait',
header: {
height: "1cm",
contents: phantom.callback(function(pageNumber, nPages) {
return "<h5>Header <b>" + pageNumber + " / " + nPages + "</b></h5>";
})
},
footer: {
height: "1cm",
contents: phantom.callback(function(pageNumber, nPages) {
return "<h5>Footer <b>" + pageNumber + " / " + nPages + "</b></h5>";
})
}
}
wpage.open(url, function (status) {
if (status !== 'success') {
console.log('Page is not opening');
phantom.exit();
} else {
wpage.render(output);
phantom.exit();
}
});
Вышеупомянутая программа генерирует следующие output.
The above will convert the page into pdf and will be saved in test.pdf
Преобразование холста в изображение
Phantomjs может легко преобразовать холст в изображение. Взгляните на следующий пример, чтобы понять, как это работает.
var page = require('webpage').create();
page.content = '<html><body><canvas id="surface" width="400" height="400"></canvas></body></html>';
page.evaluate(function() {
var context,e1;
el = document.getElementById('surface');
context = el.getContext('2d');
context.font = "30px Comic Sans MS";
context.fillStyle = "red";
context.textAlign = "center";
context.fillText("Welcome to PhantomJS ", 200, 200);
document.body.style.backgroundColor = 'white';
document.body.style.margin = '0px';
});
page.render('canvas.png');
phantom.exit();
Вышеупомянутая программа генерирует следующие output.
PhantomJS с помощью API-интерфейсов модуля веб-страницы может управлять веб-страницами и выполнять такие операции, как манипулирование DOM, нажатие на кнопки и т. Д.
Получение изображений со страницы
Следующая программа показывает, как вы можете использовать PhantomJS для получения изображений со страницы.
var wpage = require('webpage').create();
wpage.onConsoleMessage = function(str) {
console.log(str.length);
}
wpage.open("http://phantomjs.org", function(status) {
console.log(status);
var element = wpage.evaluate(function() {
var imgdata = document.querySelectorAll('img');
var imgsrc = [];
if (imgdata) {
for (var i in imgdata) {
imgsrc.push(imgdata[0].src);
}
}
return imgsrc;
});
console.log(JSON.stringify(element));
});
Вышеупомянутая программа генерирует следующие output.
Success
["http://phantomjs.org/img/phantomjslogo.png","http://phantomjs.org/img/phantom
js-logo.png","http://phantomjs.org/img/phantomjslogo.png","http://phantomjs.org
/img/phantomjs-logo.png"]
Можно включить внешний JavaScript на страницу, используя injectJS webpage method. Существует множество свойств и методов, которые могут помочь в автоматизации страниц и во многих других вещах. Вы можете обратиться к модулю веб-страницы, где подробно описаны свойства и методы.
С помощью PhantomJS мы можем отслеживать сеть и проверять поведение и производительность конкретной веб-страницы. В PhantomJS есть обратные вызовы, т.е.onResourceRequested и onResourceReceived, которые помогают отслеживать посещаемость данной страницы.
пример
В следующем примере показано, как можно использовать PhantomJS для отслеживания трафика для данной страницы.
function createHAR(address, title, startTime, resources) {
// this function formats the data which is coming from
onresourcerequest and onresourcereceived
var entries = [];
resources.forEach(function (resource) {
var request = resource.request, startReply = resource.startReply,
endReply = resource.endReply;
if (!request || !startReply || !endReply) {
return;
}
// Exclude Data URI from HAR file because
// they aren't included in specification
if (request.url.match(/(^data:image\/.*)/i)) {
return;
}
entries.push ({
startedDateTime: request.time.toISOString(),
time: endReply.time - request.time,
request: {
method: request.method,
url: request.url,
httpVersion: "HTTP/1.1",
cookies: [], headers: request.headers,
queryString: [],
headersSize: -1,
bodySize: -1
},
response: {
status: endReply.status,
statusText: endReply.statusText,
httpVersion: "HTTP/1.1",
cookies: [],
headers: endReply.headers,
redirectURL: "",
headersSize: -1,
bodySize: startReply.bodySize,
content: {
size: startReply.bodySize,
mimeType: endReply.contentType
}
},
cache: {},
timings: {
blocked: 0,
dns: -1,
connect: -1,
send: 0,
wait: startReply.time - request.time,
receive: endReply.time - startReply.time,
ssl: -1
},
pageref: address
});
});
return {
log: {
version: '1.2', creator: {
name: "PhantomJS",
version: phantom.version.major + '.' + phantom.version.minor +
'.' + phantom.version.patch
},
pages: [{
startedDateTime: startTime.toISOString(),
id: address,
title: title,
pageTimings: {
onLoad: page.endTime - page.startTime
}
}],
entries: entries
}
};
}
var page = require('webpage').create(), system = require('system');
var fs = require('fs');
if (system.args.length === 1) {
console.log('Usage: netsniff.js <some URL>');
phantom.exit(1);
} else {
page.address = system.args[1];
page.resources = [];
page.onLoadStarted = function () { // called when page is loaded
page.startTime = new Date();
};
page.onResourceRequested = function (req) {
// called when any files are requested from given page url
page.resources[req.id] = {
request: req,
startReply: null,
endReply: null
};
};
page.onResourceReceived = function (res) {
//called when any files are received.
if (res.stage === 'start') {
page.resources[res.id].startReply = res;
}
if (res.stage === 'end') {
page.resources[res.id].endReply = res;
}
};
page.open(page.address, function (status) { // open given page url
var har;
if (status !== 'success') {
console.log('FAIL to load the address');
phantom.exit(1);
} else {
page.endTime = new Date();
page.title = page.evaluate(function () { // gets the page title
return document.title;
});
har = createHAR(page.address, page.title, page.startTime, page.resources);
// calls the function createHAR with page url, starttime, and page resources.
// console.log(JSON.stringify(har, undefined, 4));
fs.write('log.txt', JSON.stringify(har, undefined, 4), 'w');
// logs are collected in log.txt file.
phantom.exit();
}
});
}
Пример файла log.txt для предварительного просмотра HAR
{
"log": {
"version": "1.2",
"creator": {
"name": "PhantomJS",
"version": "2.1.1"
},
"pages": [
{
"startedDateTime": "2017-05-21T13:41:21.824Z",
"id": "http://www.sample.com",
"title": "Free Sample Products – Sample.com ≫ Free Samples,
Free Product Samples, Product Test Marketing",
"pageTimings": {
"onLoad": 11081
}
}
],
"entries": [
{
"startedDateTime": "2017-05-21T13:41:21.815Z",
"time": 1999,
"request": {
"method": "GET",
"url": "http://www.sample.com/",
"httpVersion": "HTTP/1.1",
"cookies": [],
"headers": [
{
"name": "Accept",
"value": "text/html,application/xhtml+xml,
application/xml;q = 0.9,*/*;q = 0.8"
},
{
"name": "User-Agent",
"value": "Mozilla/5.0 (Windows NT 6.2; WOW64) AppleWebKit/538.1
(KHTML, like Gecko) PhantomJS/2.1.1 Safari/538.1"
}
],
"queryString": [],
"headersSize": -1,
"bodySize": -1
},
"response": {
"status": 301,
"statusText": "Moved Permanently",
"httpVersion": "HTTP/1.1",
"cookies": [],
"headers": [
{
"name": "Date",
"value": "Sun, 21 May 2017 13:41:25 GMT"
},
{
"name": "Server",
"value": "Apache/2.2.14 (Ubuntu)"
},
{
"name": "Location",
"value": "http://sample.com//"
},
{
"name": "Vary",
"value": "Accept-Encoding"
},
{
"name": "Content-Encoding",
"value": "gzip"
},
{
"name": "Keep-Alive",
"value": "timeout = 15, max = 100"
},
{
"name": "Connection",
"value": "Keep-Alive"
},
{
"name": "Content-Type",
"value": "text/html; charset = iso-8859-1"
}
],
"redirectURL": "",
"headersSize": -1,
"bodySize": 307,
"content": {
"size": 307,
"mimeType": "text/html; charset = iso-8859-1"
}
},
"cache": {},
"timings": {
"blocked": 0,
"dns": -1,
"connect": -1,
"send": 0,
"wait": 1999,
"receive": 0,
"ssl": -1
},
"pageref": "http://www.sample.com"
},
]
{
"startedDateTime": "2017-05-21T13:41:24.898Z",
"time": 885,
"request": {
"method": "GET",
"url": "http://sample.com/",
"httpVersion": "HTTP/1.1",
"cookies": [],
"headers": [
{
"name": "Accept",
"value": "text/html,application/xhtml+xml,
application/xml;q = 0.9,*/*;q = 0.8"
},
{
"name": "User-Agent",
"value": "Mozilla/5.0 (Windows NT 6.2; WOW64) AppleWebKit/538.1
(KHTML, like Gecko) PhantomJS/2.1.1 Safari/538.1"
}
],
"queryString": [],
"headersSize": -1,
"bodySize": -1
},
"response": {
"status": 200,
"statusText": "OK",
"httpVersion": "HTTP/1.1",
"cookies": [],
"headers": [
{
"name": "Date",
"value": "Sun, 21 May 2017 13:41:27 GMT"
},
{
"name": "Server",
"value": "Apache/2.2.14 (Ubuntu)"
},
{
"name": "X-Powered-By",
"value": "PHP/5.3.2-1ubuntu4.29"
},
{
"name": "X-Pingback",
"value": "http://sample.com/xmlrpc.php"
},
{
"name": "Link",
"value": "<http://sample.com/wp-json/>;
rel = \"https://api.w.org/\", <http://wp.me/P6Jj5H-4>;
rel = shortlink"
},
{
"name": "Vary",
"value": "Accept-Encoding"
},
{
"name": "Content-Encoding",
"value": "gzip"
},
{
"name": "Keep-Alive",
"value": "timeout = 15, max = 99"
},
{
"name": "Connection",
"value": "Keep-Alive"
},
{
"name": "Content-Type",
"value": "text/html; charset = UTF-8"
}
],
"redirectURL": "",
"headersSize": -1,
"bodySize": 1969,
"content": {
"size": 1969,
"mimeType": "text/html; charset = UTF-8"
}
},
"cache": {},
"timings": {
"blocked": 0,
"dns": -1,
"connect": -1,
"send": 0,
"wait": 869,
"receive": 16,
"ssl": -1
},
"pageref": http://www.sample.com
},
{
"startedDateTime": "2017-05-21T13:41:25.767Z",
"time": 388,
"request": {
"method": "GET",
"url": "http://sample.com/wpcontent/themes/samplecom/style.css",
"httpVersion": "HTTP/1.1",
"cookies": [],
"headers": [
{
"name": "Accept",
"value": "text/css,*/*;q = 0.1"
},
{
"name": "Referer",
"value": "http://sample.com/"
},
{
"name": "User-Agent",
"value": "Mozilla/5.0 (Windows NT 6.2; WOW64) AppleWebKit/538.1
(KHTML, like Gecko) PhantomJS/2.1.1 Safari/538.1"
}
],
"queryString": [],
"headersSize": -1,
"bodySize": -1
},
"response": {
"status": 200,
"statusText": "OK",
"httpVersion": "HTTP/1.1",
"cookies": [],
"headers": [
{
"name": "Date",
"value": "Sun, 21 May 2017 13:41:27 GMT"
},
{
"name": "Server",
"value": "Apache/2.2.14 (Ubuntu)"
},
{
"name": "Last-Modified",
"value": "Fri, 22 Apr 2011 00:32:22 GMT"
},
{
"name": "ETag",
"value": "\"e1d7-1836-4a176fdbbd180\""
},
{
"name": "Accept-Ranges",
"value": "bytes"
},
{
"name": "Vary",
"value": "Accept-Encoding"
},
{
"name": "Content-Encoding",
"value": "gzip"
},
{
"name": "Keep-Alive",
"value": "timeout = 15, max = 98"
},
{
"name": "Connection",
"value": "Keep-Alive"
},
{
"name": "Content-Type",
"value": "text/css"
}
],
"redirectURL": "",
"headersSize": -1,
"bodySize": 3174,
"content": {
"size": 3174,
"mimeType": "text/css"
}
},
"cache": {},
"timings": {
"blocked": 0,
"dns": -1,
"connect": -1,
"send": 0,
"wait": 388,
"receive": 0,
"ssl": -1
},
"pageref": "http://www.sample.com"
}
}
}
Вывод
Вышеупомянутая программа генерирует следующий вывод.
Все журналы собраны в .txt file и позже то же самое преобразуется, как указано выше, с использованием предварительного просмотра HAR, например (http://www.softwareishard.com/har/viewer/)
PhantomJSимеет много API для веб-страницы, который дает все детали. PhantomJS можно использовать для тестирования, такого как получение содержимого страницы, демонстрация экрана, преобразование страницы в pdf и т. Д. На рынке существует множество популярных библиотек для тестирования, которые можно использовать вместе с PhantomJS и для тестирования. .
Некоторые из популярных фреймворков, которые могут работать с PhantomJS, следующие:
- Mocha
- Jasmine
- Qunit
- Hiro
- Laika
- Buster.JS
- WebDriver
Пример - PhantomJS с Qunit
(function () {
var url, timeout,args = require('system').args, page = require('webpage').create();
url = args[1];
timeout = parseInt(10, 10);
page.onConsoleMessage = function (msg) {
//prints all the console messages
console.log(msg);
};
page.onInitialized = function () { // called when page is initialized
page.evaluate(callqunit);
};
page.onCallback = function (message) { // called from
var result, failed;
if (message) {
if (message.name === 'QUnit.done') {
result = message.data;
failed = !result || !result.total || result.failed;
if (!result.total) {
console.error('No tests were executed');
}
pageexit(failed ? 1 : 0);
}
}
};
page.open(url, function (status) { // opening page
if (status !== 'success') {
console.error('Unable to access network: ' + status);
pageexit(1);
} else {
var checkqunit = page.evaluate(function () {
//evaluating page and chcking if qunit object
is present on the given page url
return (typeof QUnit === 'undefined' || !QUnit);
});
if (checkqunit) {
console.error('Qunit scripts are not present on the page');
pageexit(1);
}
//timeout of 10seconds is used otherwise message from console will get printed.
setTimeout(function () {
console.error('The specified timeout of ' + timeout + ' seconds has expired.
Aborting...');
pageexit(1);
}, timeout * 1000);
}
});
function callqunit() {
qunit.html
<!DOCTYPE html>
<html>
<head>
<meta charset = "utf-8">
<meta name = "viewport" content = "width = device-width">
<title>QUnit Example</title>
<link rel = "stylesheet" href = "https://code.jquery.com/qunit/qunit-2.3.2.css">
</head>
<body>
<div id = "qunit"></div>
<div id = "qunit-fixture"></div>
<script src = "https://code.jquery.com/qunit/qunit-2.3.2.js"></script>
</body>
</html>
Вывод
Command - phantomjs qunit.js http: //localhost/tasks/qunit.html
Вышеупомянутая программа генерирует следующий вывод.
{"passed":3,"failed":2,"total":5,"runtime":23}
Time taken is 23ms to run 5 tests.
3 passed, 2 failed.
REPL означает Read Eval Print Loop. В PhantomJS REPL - это интерактивный режим для тестирования кода JavaScript. Вы можете сделать то же самое, что и в Google Chrome Inspector или Firebug, для выполнения некоторого фрагмента кода прямо на консоли. REPL возвращает вам ту же платформу для выполнения сценариев.
Набранная команда отправляется интерпретатору для немедленной интерпретации (EVAL) и предоставления обратной связи (PRINT). ВойтиPhantomJS в командной строке, и вы перейдете в интерактивный режим, в котором вы сможете выполнить свой код напрямую.
Синтаксис
Его синтаксис следующий -
Phantomjs
пример
В следующем примере показано, как REPL работает в PhantomJS.
phantomjs> console.log("Welcome to phantomjs");
Welcome to phantomjs
Undefined
phantomjs> window.navigator {
"appCodeName": "Mozilla",
"appName": "Netscape",
"appVersion": "5.0 (Windows NT 6.2; WOW64) AppleWebKit/538.1 (KHTML, like Gecko)
PhantomJS/2.1.1 Safari/538.1",
"cookieEnabled": true,
"language": "en-IN",
"mimeTypes": {
"length": 0
},
"onLine": false,
"platform": "Win32",
"plugins": {
"length": 0
},
"product": "Gecko
"productSub": "20030107",
"userAgent": "Mozilla/5.0 (Windows NT 6.2; WOW64) AppleWebKit/538.1 (KHTML, like Gecko)
PhantomJS/2.1.1 Safari/538.1",
"vendor": "Apple Computer, Inc.",
"vendorSub": ""
}
phantomjs>
To find the version
phantomjs> phantom.version {
"major": 2,
"minor": 1,
"patch": 1
}
phantomjs>
Каждая команда выполняется, и отображается результат. Используйте CTRL + C, CTRL + D илиphantom.exit() выйти из интерактивного режима.
Использовать up/down клавиши со стрелками для прослушивания ранее набранных команд.
Есть еще одна функция, которая называется autocompletion, что помогает запомнить команду. Просто введите «фантом» и нажмите кнопку «Tab», чтобы получить список доступных команд, которые вы можете выполнить.
Вывод
Вышеупомянутая программа генерирует следующий вывод.
phantomjs> phantom.→|
phantomjs> phantom.cookies→|
phantomjs> phantom.exit→|
phantomjs> phantom.version→|
В этой главе мы приводим еще несколько практических примеров, чтобы понять некоторые важные особенности PhantomJS.
Пример 1 - Найдите скорость страницы
В этом примере мы будем использовать PhantomJS, чтобы найти page speed для любого заданного URL-адреса страницы.
var page = require('webpage').create(),
system = require('system'),
t, address;
if (system.args.length === 1) {
console.log('Usage: loadspeed.js <some URL>');
phantom.exit(1);
} else {
t = Date.now();
address = system.args[1];
page.open(address, function (status) {
if (status !== 'success') {
console.log('FAIL to load the address');
} else {
t = Date.now() - t;
console.log('Page title is ' + page.evaluate(function () {
return document.title;
}));
console.log('Loading time ' + t + ' msec');
}
phantom.exit();
});
}
Вышеупомянутая программа генерирует следующие output.
Command - phantomjs pagespeed.js http://www.google.com
Page title is Google
Loading time 1396 msec
Пример 2. Отправка события клика на страницу
В следующем примере мы будем использовать PhantomJS для отправки click event на страницу.
var page = require('webpage').create();
page.onConsoleMessage = function(str) {
console.log(str);
}
page.open('http://phantomjs.org/api/phantom/', function(status) {
page.render('beforeclick.png');
console.log(page.url);
var element = page.evaluate(function() {
return document.querySelector('img[src = "http://phantomjs.org/img/phantomjslogo.png"]');
});
page.sendEvent('click', element.offsetLeft, element.offsetTop, 'left');
window.setTimeout(function () {
console.log(page.url);
page.render('afterclick.png');
phantom.exit();
}, 5000);
console.log('element is ' + element);
});
Вышеупомянутая программа генерирует следующие output.
http://phantomjs.org/api/phantom/
element is [object Object]
http://phantomjs.org/
Наша программа создаст следующие два png изображения в binпапка. Эти два изображения показывают разницу до и после выполнения вышеуказанной программы.
Пример 3 - Отправка формы
В следующем примере показано, как отправить форму с помощью PhantomJS.
var wpage = require('webpage').create();
wpage.open("http://localhost/tasks/submitform.html", function(status) {
console.log(status);
wpage.uploadFile('input[name = fileToUpload]', 'output.png');
wpage.render("sform.png");
var element = wpage.evaluate(function() {
return document.querySelector('input[type = "submit"]');
// getting details of submit button using queryselector.
});
wpage.sendEvent('click', element.offsetLeft, element.offsetTop, 'left');
// sendevent is used to send click event and also giving the left and top
position of the submit button.
window.setTimeout(function () {
console.log(wpage.url);
wpage.render("submit.png"); // screenshot is saved in submit.png
phantom.exit();
}, 5000);
console.log('element is ' + element);
});
submitform.html
В следующем коде показано, как использовать submitform.html файл.
<html>
<head>
<title>Window 2</title>
</head>
<body>
<form action = "submitform.php" method = "post" enctype = "multipart/form-data"
id = "form1">
<input type = "file" name = "fileToUpload" id = "fileToUpload">
<input type = "submit" value = "Upload Image" name = "submit">
</form>
</body>
</html>
После отправки форма переходит в submitform.php.
submitform.php
submitform.php просто печатает сведения о файлах.
<?php
print_r($_FILES);
?>
Вышеупомянутая программа генерирует следующие output.
Success
element is [object Object]
http://localhost/tasks/submitform.php
Картинки
Ниже приведены изображения для file upload и form submit.