Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
17HackersLT20180119.pdf
Search
mkashima
January 19, 2018
Technology
0
85
17HackersLT20180119.pdf
mkashima
January 19, 2018
Tweet
Share
Other Decks in Technology
See All in Technology
Improve Your Development Workflow with Gemini Code Assist
meteatamel
0
130
web-application-security
matsuihidetoshi
1
190
[新卒向け研修資料] テスト文字列に「うんこ」と入れるな(2024年版)
infiniteloop_inc
5
18k
AWS学習者向けにAzureの解説スライドを作成した話
handy
3
200
Gitlab本から学んだこと - そーだいなるプレイバック / gitlab-book
soudai
7
1.3k
Building Dashboards as a Hobby
egmc
0
380
データベース03: 関係データモデル
trycycle
0
100
Babylon.js JAPAN活動紹介 (2024/4)
limes2018
1
120
M&A戦略を支えるデータマネジメント (MIDAS Tech Study #16 GENDA Komiyama)
kommy339
1
120
LangSmith入門―トレース/評価/プロンプト管理などを担うLLMアプリ開発プラットフォーム
os1ma
5
740
一生覚えておきたい「システム開発=コミュニケーション」〜初めての実務案件振り返りLT〜
maimyyym
2
330
Gradle Build Scanを使ってビルドのことを知ろう potatotips #87
tomorrowkey
2
160
Featured
See All Featured
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
126
32k
Statistics for Hackers
jakevdp
790
220k
The Brand Is Dead. Long Live the Brand.
mthomps
49
29k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
358
22k
The Mythical Team-Month
searls
216
42k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
323
20k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
33
6k
A Tale of Four Properties
chriscoyier
152
22k
Building Adaptive Systems
keathley
32
1.9k
Imperfection Machines: The Place of Print at Facebook
scottboms
261
12k
Unsuck your backbone
ammeep
663
57k
StorybookのUI Testing Handbookを読んだ
zakiyama
13
4.6k
Transcript
PhantomJSで 快適スクレイピング生活 株式会社オールアバウト 鹿島真人 1
自己紹介 名前 鹿島 真人(カシマ マコト) 仕事 2017~ マークアップエンジニア・UXデザイン 2018~ 広告配信システムの運用
趣味 筋トレ 推し 黒澤ルビィ 2
Agenda PhantomJSとは PhantomJSを使った理由 PhantomJSでできること PhatomJSのDos&Don'ts 3
PhantomJSとは 4
PhantomJSとは コマンドラインから動くWebブラウザ(ヘッドレスブラウザ)。 $ phantomjs example.js // example.js var page =
require('webpage').create(); // おまじない page.open('http://google.com', function (status) { // Page Opened! }); 上記のようなコードを介してスクレイピング(Webサイトに外部 からアクセスして情報収集)できるツール。 5
PhantomJSを使った理由 6
PhantomJSを使った理由 データを分析して商品紹介サイトのCTR改善施策を打ちたい 仮説 → データ出し → 仮説検証 → フィードバック →
仮説 → … 仮説 紹介商品数が多い方が良いのでは? 商品情報欄の文字数が多い方が良いのでは? 最初の購買ボタンまでの冒頭の長さとCTRが関係あるのでは? etc... 7
PhantomJSを使った理由 必要な情報の例 記事ID CTR 商品数 商品情報の文字数 最初の商品までの距離 1 15% 12個
528文字 1280px 自サイトのDBでも集計ツールでも取れないデータがある DBで取れても、毎回エンジニアに依頼するとスピード感を損 なう 8
PhantomJSを使った理由 他サイトの情報もとってみたい 競合サイトはどんなコンテンツを作っている? 競合サイトの見出しやタイトルでのSEO対策はどうなっている? → スクレイピングしよう!! 9
PhantomJSでできること 10
PhantomJSでできること 基本のつかいかた require('webpage') でWebページのオブジェクトを作成。 var page = require('webpage').create(); open(url, callback())
Webページを開く。 page.open('http://google.com', function (status) { }); 11
PhantomJSでできること render() でスクリーンショットがとれる。 var page = require('webpage').create(); page.open('http://google.com', function (status)
{ page.viewportSize = {width:'800px', height:'600px'}; page.render('output.png'); }); 12
PhantomJSでできること settings.userAgent でUserAgent偽装 var page = require('webpage').create(); page.open('http://google.com', function (status)
{ page.viewportSize = {width:'800px', height:'600px'}; page.settings.userAgent = 'Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A372 Safari/604.1'; // iOS11 の Safari に偽装 page.render('output.png'); }); 実演 13
PhantomJSでできること evaluate() ページ内でJSを走らせる。 includeJS() 外部ライブラリの読み込み。 page.open('http://google.com', function (status) { page.includeJs('../lib/jquery.min.js',
function() { // JQueryを読み込み page.evaluate(function() { // アクセスしたページで実行 console.log($('.foo').text()); }); }); }); DOM要素の中身を取ってきたりするのに使える。 ex) 記事の小見出しを全取得、特定のクラスを持つ要素のテキストを全取得 実演 14
PhantomJSでできること POST通信もできる open() に引数としてメソッド、データ、ヘッダーを渡す var data = {"kurosawa": "ruby", "kunikida":
"hanamaru"}; var headers = {"Content-Type": "application/json"}; var server = "http://posttestserver.com/post.php?dump"; page.open(server, 'POST', data, headers, function (status) { // POST 通信 }); 15
PhantomJSでできること そのほか addCookie() でCookie追加/削除 deleteCookie() で特定Cookie削除 . ファイルシステムのモジュールも用意 var fs
= require('fs'); fs.read('input.csv'); fs.write('output.csv', data); 16
PhantomJS の Dos&Dont's 17
Dos&Dont's DOMの情報を取得したい // DONT var foo; page.evaluate(function () { foo
= $('.bar').text(); }); // evaluateの外側にアクセスできない! // DO var getFoo = page.evaluate(function () { var foo = $('.bar').text(); return foo; }); // 関数の返り値として受け取る。 18
Dos&Dont's evaluate() 中に、コマンドラインにconsoleを出したい // DONT page.evaluate(function () { console.log('evaluateなう'); });
// コマンドラインには表示されない! // DO page.onConsoleMessage = function(msg, lineNum, sourceId) { console.log(msg); }; page.evaluate(function () { console.log('evaluateなう'); }); // onConsoleMessage() を使う。 19
Dos&Dont's for文で複数URLまわしたい // DONT for (var i = 0; i
< urls.length; i++) { page.open(urls[i], function (status) { }); } // page.openは非同期のため、for文が先に回ってしまう! // DO function process() { page.open(urls[0], function (status) { urls.shift(); process(); }); } // 順番に実行される。 20
まとめ 21
まとめ PhantomJSはコマンドラインから実行するヘッドレスブラウ ザ。 Webスクレイピングに使える。 . webpage モジュールに用意されてるメソッドを使って、色々で きる。 とくに evaluate()
はページ内でJSを実行できるので、ページ 上でJSでできることはなんでもできる。 . Web上の情報を快適に自動収集できる。 22
注意 23
NOTICE! Webスクレイピングは一部で法律関係の議論があります アクセスが攻撃にならないように注意 Librahack事件 音声や動画のダウンロードには注意 違法コンテンツダウンロード刑罰化 24
さいごに 25
専門家が選ぶお買い物情報メディア 26