第一回Webスクレイピング勉強会 LT発表資料

1. 東京スクレイピング勉強会＃１ 2014.6.22
CasperJSを使って任意のWebサイトをEPub電子書籍化する方法
Masayuki Isobe / 礒部 正幸 / @chiral
Adfive, Inc.

2. 自己紹介
• 礒部正幸（いそべ まさゆき）
• 職業： ソフトウェアエンジニア
• 現在： アドファイブ（株） 代表 http://www.adfive.net
– 現体制： 代表１名 + 外注数名 : お問い合わせ
– 自社製品： モバイルO2Oアプリ/オウンドメディア/アドサーバ
– 受託業務： システムコンサルティング/システム開発/データ分析
• 東工大卒 （B：情報工学科、M：計算工学専攻）
• インターネット活動
– TwitterID: @chiral
– （ブログ：アドファイブ日記） http://d.hatena.ne.jp/isobe1978/
• 「機械学習ハッカソン」主催： http://mlhackathon.connpass.com/
• 近年作ったスクレイピング利用システム
– パケットデータから閲覧Webページの画面キャプチャ再構成
（PhantomJS+自作プロキシーサーバ）
– WebサイトのEPub電子書籍化ツール（Node.js/CasperJS）
– WebスクレイピングDSL（ Scrapy/PhantomJS）
– Webスクレイピングジョブ管理システム（Django）
本資料

3. EPUBについて
・ iBookやKindleでオフラインでも読むことができるパッケージコンテンツフォーマット
・中身は Web（HTML/CSS）の静的スナップショット ＋ メタ情報 みたいな感じ
・当初喧伝されたわりに流行ってない
画像の埋め込みは簡単に可能
Web上のコンテンツをキャプチャして、パッケージメ
ディア化するのは簡単にできそう
Webページ
コンテンツ本体の部分だけ
キャプチャ画像を取得
キャプチャした画像
EPUBフォーマット
でパッケージング
参考） 類似コンセプトのサービス
ただしこちらはキャプチャ画像ではなく
Webデータそのものを保存

4. CasperJS : Webページの部分キャプチャ機能
• PhandomJSのキャプチャ機能は、ページ全体しか取れない、困った。
色々調べてみると、
ｷﾀ━━━(ﾟ∀ﾟ).━━━!!!
→ CasperJSならば部分キャプチャが可能！
（フリーのライブラリでこの機能を持つものは、発表者の知る限りでは恐らくこのCasperJSしかない）

5. 画像としてパッケージングする際の問題
• EPUBはリフロー型
- 画像を一つのオブジェクトとして
レイアウトしようとしてしまう。
横にしたとき
縦のとき
キャプ
チャ
画像
キャ
プ
チャ
画
像
ならば、ザクザクと画像を切り
刻んで並べればいいじゃないか
キャプ
チャ
画像
横にしたとき
縦のとき
はみ出した分
は次ページへ
1page
2page 3page
4page
端末サイズにも対応でき、
リフロー型のメリットが活きる

6. 画像を刻むアルゴリズム
・基本的に水平にしか切らない
・文字や画像にぶつからないところで切る
・背景の色などに左右されない必要がある
→ キャプチャした画像をエッジフィルタに掛けてエッジが無い空白区間の中点を取る
……
PythonのPILで実装
対象
Webページ
キャプチャ

7. システム全体の流れ
ユーザがパッケージングしたい対象URL群を入力
DB
コンテンツ本体の
CSSセレクタを保持
CasperJSでWebページを部分キャプチャ キャプチャ対象にする
部分のCSSセレクタ
PIL(Python)でエッジフィルタ＆画像を切り刻む
EPUB形式に画像,XHTML,メタ情報ファイル等を配置
EPUBファイル出力 （zip圧縮）
Webサービスとして
Node.js/Express/PM2
で作成

8. デモ：EPubShot
• Webでデモを公開しています。
http://epubshot.adfive.net/
トップ画面
CSSセレクタ登録画面
作成完了
E-mail送付機能なども付けてあったり..

9. 某料理レシピサイトから作ったEPUBのリーダアプリのキャプチャ
・ こんな感じに、きれいにEPUB化できます。
・YahooNewsやはてなダイアリーなどもキレイに取れます。
・背景がミドリすぎる山本一郎氏のブログもちゃんと画像を
刻んでリフローなEPUBを出力します。
（背景色に左右されないのがエッジフィルタの利点）
いつみてもミドリミドリしてる

10. というシステムを、
企画～調査～アルゴリズム検討～実装～リリースまで
トータル５日くらいでやって、いくつか(※)営業に
行ってみたのですが、売れませんでした（笑）
Powered ｂｙ
※某レ○ピサイト企業とか、その他いくつか