- PVSM.RU - https://www.pvsm.ru -
Взаимодействие с браузерами никогда не было работой для слабонервных: около полудюжины различных API, различные механизмы IPC, и разные возможности у разных поставщиков. Такие проекты, как WebDriver [1], пытаются абстрагироваться от этой сложности, к тому же в Сети можно найти десятки [2] других «безголовых» драйверов, использующих WebKit или иные движки. В настоящее время в работе даже находится спецификация W3C на WebDriver [3].
Тем не менее, в то время, как создание общего решения является сложной задачей, оказалось, что инструментирование Chrome очень просто, — как я недавно обнаружил при исследовании некоторых вопросов, связанных с сетевыми задержками. Начиная с 18 версии, Chrome теперь поддерживает протокол удалённой отладки v1.0 [4], который предоставляет все возможности браузера с помощью обычного WebSocket!
/Applications/Path To/Google Chrome --remote-debugging-port=9222 # OSX
$> curl localhost:9222/json
[ {
"devtoolsFrontendUrl": "/devtools/devtools.html?host=localhost:9222&page=1",
"faviconUrl": "",
"thumbnailUrl": "/thumb/chrome://newtab/",
"title": "New Tab",
"url": "chrome://newtab/",
"webSocketDebuggerUrl": "ws://localhost:9222/devtools/page/1"
} ]
Сперва мы включаем возможность удалённой отладки в Chrome [5] (по умолчанию выключено). С этого момента Chrome предоставляет HTTP-сервер, который позволяет контролировать все открытые вкладки. Каждая вкладка представляет собой изолированный процесс и, следовательно, работает со своим WebSocket, путь к которому доступен через атрибут webSocketDebuggerUrl
. Давайте попробуем сделать что-нибудь с этим:
require 'em-http'
require 'faye/websocket'
require 'json'
EM.run do
# Chrome runs an HTTP handler listing available tabs
conn = EM::HttpRequest.new('http://localhost:9222/json').get
conn.callback do
resp = JSON.parse(conn.response)
puts "#{resp.size} available tabs, Chrome response: n#{resp}"
# connect to first tab via the WS debug URL
ws = Faye::WebSocket::Client.new(resp.first['webSocketDebuggerUrl'])
ws.onopen = lambda do |event|
# once connected, enable network tracking
ws.send JSON.dump({id: 1, method: 'Network.enable'})
# tell Chrome to navigate to twitter.com and look for "chrome" tweets
ws.send JSON.dump({
id: 2,
method: 'Page.navigate',
params: {url: 'http://twitter.com/#!/search/chrome?q=chrome&' + rand(100).to_s}
})
end
ws.onmessage = lambda do |event|
# print event notifications from Chrome to the console
p [:new_message, JSON.parse(event.data)]
end
end
end
В этом примере мы говорим Chrome, чтобы он включил отслеживание и нотификации сетевого трафика, а затем говорим ему, что нужно выполнить поиск в Twitter. При этом Chrome будет направлять нам десятки уведомлений сети: начальная выборка страницы, уведомления для каждого подресурса, XHR, и так далее (например, событие [6] Network.responseReceived
). На самом деле, если вы оставите Web-страницу открытой, вы также увидите события длительного опроса (long polling), генерируемые для получения новых твитов. Тонны информации [7], все в вашем распоряжении.
Приведенный выше пример иллюстрирует очень простое взаимодействие с Network API, но протокол предоставляет гораздо больше возможностей. Вы можете работать с отладчиком JavaScript, управлять виртуальной машиной V8, модифицировать и изучать DOM, а также отслеживать хронологию событий, а ещё более чем полдюжины других возможностей [4]. Наконец, хотя круто управлять настольным браузером, управлением браузером на вашем телефоне ещё круче: Chrome для Android [8] предоставляет все те же возможности [9].
Автор: akzhan
Сайт-источник PVSM.RU: https://www.pvsm.ru
Путь до страницы источника: https://www.pvsm.ru/ruby/5231
Ссылки в тексте:
[1] WebDriver: http://google-opensource.blogspot.com/2009/05/introducing-webdriver.html
[2] найти десятки: https://github.com/search?utf8=%E2%9C%93&q=headless&repo=&langOverride=&start_value=1&type=Repositories&language=
[3] спецификация W3C на WebDriver: http://dvcs.w3.org/hg/webdriver/raw-file/tip/webdriver-spec.html
[4] протокол удалённой отладки v1.0: https://developers.google.com/chrome-developer-tools/docs/protocol/1.0/index
[5] удалённой отладки в Chrome: http://blog.chromium.org/2011/05/remote-debugging-with-chrome-developer.html
[6] событие: https://gist.github.com/2331998
[7] Тонны информации: https://developers.google.com/chrome-developer-tools/docs/protocol/1.0/network
[8] Chrome для Android: http://googleblog.blogspot.com/2012/02/introducing-chrome-for-android.html
[9] все те же возможности: https://developers.google.com/chrome/mobile/
Нажмите здесь для печати.