Chanmoro

GravとはGrav は「フラットファイル CMS」という種類の CMS の1つです。フラットファイル CMS は Wordpress などの CMS と違って DB は使わずに全てのデータをテキストファイルで管理します。そのため環境のセットアップやバックアップの取得がとても簡単です。過去に Grav を使って Web サイトを作ったことがありその後の運用でも特に問題なく使えていて紹介したい気持ちが高まってきたので、この記事では Grav で Web サイトを作るときの基本をまとめてみます。TL;DRPHP があればどこでも動くインストール・デプロイはファイル一式を置くだけカスタムテーマを作れば自由にデザインを実装できる環境構築Grav v1.6 では以下の環境が必要です。 - Web サーバー (Apache, Nginx, LiteSpeed, Lightly, IIS, など) - PHP 7.1.3 以上https://learn.getgrav.org/16/basics/requirementsWeb サーバーから PHP を動かせる環境があれば OK なので非常に簡単です。インストール1. 公式ドキュメントから Grav の zip をダウンロードする以下の URL から Grav の zip をダウンロードします。普通に Web サイトを作るのであれば、GUI の管理画面のプラグインが同梱されている  Grav core + Admin plugin の zip をダウンロードするのがオススメです。https://getgrav.org/downloadsダウンロードが完了したら zip ファイルを解凍して適当な場所に配置します。2. ローカル環境で起動するファイル一式を置くだけで Grav 自体のインストールはできています。ローカル環境で動作を確認してみます。$ cd grav-admin# PHP に組み込みの Web サーバーで Grav を起動$ php -S localhost:8000 system/router.phpブラウザから http://localhost:8000/admin へアクセスし、以下のような画面が表示されればインストール成功です。このフォームから管理者ユーザーの登録をします。登録が完了してから再度 http://localhost:8000/admin へアクセスすると以下のようなデフォルトのトップページが表示されます。ページを作るページ追加のチュートリアルに沿って設定をしていけば簡単にページの追加はできますが、ポイントになりそうな箇所だけ説明していきます。https://learn.getgrav.org/16/basics/basic-tutorial1. ページ内容ページの内容は user/pages の下に markdown 形式で追加していきます。--- で区切られた範囲はページのヘッダー部と解釈されてページのプロパティを設定することができます。---title: ページタイトルhoge:  futa:ヘッダーには任意のメタ情報を付け足すことができます---# My New Page!This is the body of **my new page** and I can easily use _Markdown_ syntax here.ヘッダー部に設定できる値については title のように Grav で予約されているキーがいくつかあります。https://learn.getgrav.org/16/content/headersGrav で予約されていないキー名については自由にセットすることができます。上記の例の hoge.fuga はテンプレートから page.header.hoge.fuga のようにアクセスすることができます。2. ページのデザインmarkdown のファイル名はその時点で有効になっているテーマのテンプレート名と対応してします。インストール直後のデフォルトでは default.md のページが配置されていますが、これは grav-admin/user/themes/quark/templates/default.html.twig のテンプレートのデザインを適用するということを示しています。3. ページの URL パスpages 配下のディレクトリ構造がそのまま URL パスと対応しています。例えば以下のようなディレクトリ構造でページを追加したとします。user/pages/├── 01.home│   └── home.md├── 02.about│   └── about.md└── 03.hoge    ├── 01.fuga    │   └── article.md    └── 02.piyo        └── article.mdこの場合は以下の４つのページ (URL) が作られることになります。- /- /about- /hoge/fuga- /hoge/piyoこの時 top にはパスなしの / が対応するのですが、これは設定ファイルでホームのパスを指定することができ、ここで設定したパスには / でアクセスすることができるためです。grav-admin/user/config/system.yamlhome:  alias: '/home'この設定値を変更することでホームのパスを任意に設定できます。ページデザインを自分で作るGrav で使えるテーマは OSS で公開されているものがあり、Grav 公式サイトや GitHub で公開されています。https://getgrav.org/downloads/themesですが、作りたい Web サイトによっては1から自分で作ったデザインを適用したい場合もあると思います。この場合は Grav のカスタムテンプレートを自分で追加することで、自由にデザインを作ることができます。0. devtools をインストールするgrav-admin の直下で以下を実行して devtools をインストールします。$ bin/gpm install devtools1. カスタムテーマの雛形を作成するインストールした devtools を使って対話的に情報を入力していくとカスタムテーマの雛形が作成されます。$ bin/plugin devtools new-themeEnter Theme Name: MyDesignEnter Theme Description: this is my designEnter Developer Name: chanmoroEnter GitHub ID (can be blank): chanmoro Enter Developer Email: kazuki.m777@gmail.comPlease choose an option  [pure-blank ] Basic Theme using Pure.css  [inheritance] Inherit from another theme  [copy       ] Copy another theme > pure-blankSUCCESS theme MyDesign -> Created SuccessfullyPath: /Users/chanmoro/grav_sample/grav-admin/user/themes/my-designコンソールに表示されていますが user/themes/my-design にカスタムテーマのファイル一式が追加されています。2. カスタムテーマを有効にするuser/config/system.yaml で有効にするテーマを設定します。デフォルトでは以下のように quark がセットされているので、ここを新規に追加したカスタムテーマの名前に差し替えます。user/config/system.yaml pages:-  theme: quark+  theme: my-designここで http://localhost:8000/ にアクセスすると以下のように雛形の最初の状態のデザインのページが表示されます。3. カスタムテーマのデザインを実装するカスタムテーマのテンプレートファイルは user/themes/<テーマ名>/templates/ に格納されています。例えば default.html.twig は以下のような内容になっていました。default.html.twig{% extends 'partials/base.html.twig' %}{% block content %}    {{ page.content }}{% endblock %}テンプレートのファイルはテンプレートエンジンの Twig で書かれているので、 Twig のお作法にのっとって自由に書くことができます。基本的な書き方は Grav のチュートリアルに書かれているので、実際にテーマを実装していく時にはまずはこちらを見てみてください。https://learn.getgrav.org/16/themes/theme-tutorialGrav のサイトを公開するGrav のサイトをインターネットに公開するには、PHP が動かせるサーバーを用意します。Grav の動作要件にある PHP 7.1.3 以上が動かせる環境であればどこでも問題ないです。参考までに僕は Grav の Web サイト運用している Web サイトは エックスサーバー で動かしていますが、その他のレンタルサーバーや VPS であっても PHP さえ動けばどこでも動作します。このお手軽さが最高ですね。1. Grav のサイトをデプロイするデプロイは Grav のファイル一式を git リポジトリで管理して、サーバー側でこれを clone、もしくはファイル一式を FTP などでアップロードするだけです。grav のサイトを生成した時に .htaccess のファイルも同時に作られているので、ドキュメントルートにそのままファイル一式を配置すれば動くようになっています。2. キャッシュクリアする変更をデプロイしたときには Twig テンプレートのキャッシュがサーバー側に残っていて HTML がすぐに変更されない場合があるので、デプロイ後は以下のコマンドでキャッシュをクリアしておくと安心です。$ ./bin/grav cacheもしくは管理画面から GUI でキャッシュクリアをすることもできます。まとめさて、今回はフラットファイル CMS の Grav を使って Web サイトを作るための手順をざっくり紹介しました。CMS といえば Wordpress がデファクトになってはいますが、個人でのサイト運用を考えるとなるべく RDB や動く部品は少なくしたいなーという気持ちがあります。僕が Grav を選んだ理由は、非エンジニアの人がサイト内のページを GUI から追加・編集できるようにしたかったのですが、Admin のプラグインがシンプルで使いやすいのでそこが決め手でした。メンテナンスの簡単さだけを考えると静的サイトジェネレーターを使えばいいのですが、いくつかの人気な静的サイトジェネレーターのページ編集を GUI でやるにはあまりいいソフトウェアがなかったので、動作環境の要件を多少譲歩して Grav を使うことにしました。参考までに現在は以下のサイトを Grav で実装して運用しています。Re-THOS websitehttps://re-thos.com/Kage Desin Office websitehttps://kagedsgn.com/それでは皆さんも Grav を使って快適なフラットファイル CMS ライフをお楽しみください！

10分で理解する Grav

LAPRAS アウトプットリレー7日目の記事です！こんにちは！LAPRAS クローラーエンジニアの @Chanmoro です！先日クローラーの作り方 - Basic 編という記事を書かせて頂きましたが、今回の記事では「クローラーの作り方 - Advanced 編」と題しまして、本格的にクローラーを開発する際にどういう問題に直面するかと、クローラーをどのような設計にしておくとこれらの問題に対処しやすいメンテナブルなクローラーにできるかというのを簡単に紹介したいと思います。クローラー運用でよくある問題の例さて、クローラーの作り方 - Basic 編で紹介したような方法でミニマムなクローラーを実装することができますが、そこから更に定期的にクロールを繰り返してデータを更新する運用を始めると、大抵の場合で以下のような問題に直面することになります。クロール先の HTML 構造が変化するクロール先の障害や一時的なエラーid が変化するクローラー開発者にとってはどれも「あるあるー」という感じの問題なのですが、クローラーを運用し続けるには少なくともこれらの課題をクリアする必要があります。「クロール先の HTML 構造が変化する」問題クロール先のサービスでは絶えず変更が続けられているので、ある日突然 HTML 構造が変化して目的のデータが取得できなくなる可能性があります。設計によっては、おかしな値が取得されてデータベースを上書きされてこれまでに蓄積したデータが全て壊れる可能性も十分あります。僕がこれまでにこの課題に対して対応したことがあるのは以下のような方法です。クロールして取得される値に対してバリデーションを入れるクロール先サービスを定点観測するテストを定期実行するクロールして取得される値に対してバリデーションを入れるこれはもしかすると最初に思いつくかもしれませんが、クロール先から取得されるデータに対するバリデーションを導入する方法です。フォーマットや型を限定することができるデータに対してはバリデーションのルールを実装することでおかしなデータがデータベースに入ることを防ぐことができます。しかし、この方法の弱点は特定のフォーマットが決められないデータや、必須項目ではないデータに対してはバリデーションのルールを定義することができないので、一部の項目にしか適用できないデメリットがあります。クロール先サービスを定点観測するテストを定期実行するこの方法は、定点観測 = クロール先サービスに実際にアクセスして取得されるデータが想定の値になっているか、のテストを定期的に実行することで HTML 構造の変化を検知する方法です。特定のアカウントやページに対するテストを書き、それを定期実行することで実装できます。scrapy には contract という機能があり、指定した URL に対して実際にアクセスをし取得されたレスポンスに対してテストを書くことができるのですが、そこからアイディアを得ました。ただしこの方法は、自分で定点観測用のアカウントを作成したりデータを用意できる場合は有用ですが、そうではない場合は対象のアカウントやページが更新される度にテストが失敗することになります。(テストの詳細に依存はしますが)更に、例えば為替のデータのような高頻度で内容が変化するようなデータに対しては厳密なテストを書くことができません。クロール先の HTML 構造が変化する問題への対象として2つの方法を紹介しましたが、もちろんこれらが全てではありません。「クロール先の障害や一時的なエラー」問題クロール先サービス側で障害が発生しているときに、一時的にエラーのレスポンスが返されることも有り得ます。レスポンスのステータスコードを見てクローラーの処理を分岐しているような場合にこれが問題となることがあります。例えばレスポンスステータスが 404 だった場合に該当のデータが削除されていたと判断し、該当のデータを削除する処理を実装していたとします。この時クロール先サービス側では仕様のバグや何らかのエラーにより一時的に 404 が返されていたとすると、実際には該当のデータは削除されていないが、クローラー側では削除されたと誤って判断してしまう問題が発生します。この問題の対処については、しばらく時間をあけてリトライすることで一時的なレスポンスなのかを見分ける方法が有効です。「id が変化する」問題URL にクロール対象の ID が含まれる設計になっているサービスで、後から ID を変更できる仕様になっているサービスをクロールする場合、変更後の id も変更前のデータと同じとして扱いたい場合があります。例えばユーザーの ID を変更できたり、一度投稿されたデータの URL を変更できる仕様になっているようなサービスのクロールです。サービスによっては 301 リダイレクトしてくれるので、この場合は旧 URL と新 URL を比べることで id の対応が分かります。この場合の対処は比較的簡単で、301 リダイレクトされたあとの URL に含まれる id を取得してデータを更新することで追従できます。注意点としては、クロール先データの id は可変なのでクローラーのシステム上では id としては扱ってはいけないということになります。また、ものによっては旧 URL が 404 になり、新しい URL への対応が分からない場合があるので、旧 URL のデータを削除して新 URL のデータが新規に追加されるのを待つしかない場合というのもあり得ます。メンテナブルなコードでクローラーを表現するさて、これまでに紹介した 3 つの問題は大抵のクローラーが直面することになるのではないかと想像しています。紹介したコード はかなりベタベタな実装だったので、今回紹介したような問題に対処する実装をパッと見どこに入れたらいいかが分かりません。そこで、例えば以下のようにクローラーの処理をいくつかのレイヤーに分割してみます。parserHTML をパースしてデータを抽出する層crawlerLAPRAS NOTE へのリクエストを送り parser を呼び出す層usecasecrawler と、取得されたデータの永続化処理を呼び出す層import jsonimport timeimport dataclassesfrom typing import List, Optionalimport requestsfrom bs4 import BeautifulSoup@dataclasses.dataclass(frozen=True)class ArticleListPageParser:    @dataclasses.dataclass(frozen=True)    class ArticleListData:        """        記事一覧ページから取得されるデータを表すクラス        """        article_url_list: List[str]        next_page_link: Optional[str]    @classmethod    def parse(self, html: str) -> ArticleListData:        soup = BeautifulSoup(html, 'html.parser')        next_page_link = soup.select_one("nav.navigation.pagination a.next.page-numbers")        return self.ArticleListData(            article_url_list=[a["href"] for a in soup.select("#main div.post-item h2 > a")],            next_page_link=next_page_link["href"] if next_page_link else None        )@dataclasses.dataclass(frozen=True)class ArticleDetailPageParser:    @dataclasses.dataclass(frozen=True)    class ArticleDetailData:        """        記事詳細ページから取得されるデータを表すクラス        """        title: str        publish_date: str        category: str        content: str    def parse(self, html: str) -> ArticleDetailData:        soup = BeautifulSoup(html, 'html.parser')        return self.ArticleDetailData(            title=soup.select_one("h1").get_text(),            publish_date=soup.select_one("article header div.entry-meta").find(text=True, recursive=False).replace("｜", ""),            category=soup.select_one("article header div.entry-meta a").get_text(),            content=soup.select_one("article div.entry-content").get_text(strip=True)        )@dataclasses.dataclass(frozen=True)class LaprasNoteCrawler:    INDEX_PAGE_URL = "https://note.lapras.com/"    article_list_page_parser: ArticleListPageParser    article_detail_page_parser: ArticleDetailPageParser    def crawl_lapras_note_articles(self) -> List[ArticleDetailPageParser.ArticleDetailData]:        """        LAPRAS NOTE をクロールして記事のデータを全て取得する        """        return [self.crawl_article_detail_page(u) for u in self.crawl_article_list_page(self.INDEX_PAGE_URL)]    def crawl_article_list_page(self, start_url: str) -> List[str]:        """        記事一覧ページをクロールして記事詳細の URL を全て取得する        """        print(f"Accessing to {start_url}...")        # https://note.lapras.com/ へアクセスする        response = requests.get(start_url)        response.raise_for_status()        time.sleep(10)        # レスポンス HTML から記事詳細の URL を取得する        page_data = self.article_list_page_parser.parse(response.text)        article_url_list = page_data.article_url_list        # 次ページのリンクがあれば取得する        while page_data.next_page_link:            print(f'Accessing to {page_data.next_page_link}...')            response = requests.get(page_data.next_page_link)            time.sleep(10)            page_data = self.article_list_page_parser.parse(response.text)            article_url_list += page_data.article_url_list        return article_url_list    def crawl_article_detail_page(self, url: str) -> ArticleDetailPageParser.ArticleDetailData:        """        記事詳細ページをクロールして記事のデータを取得する        """        # 記事詳細へアクセスする        print(f"Accessing to {url}...")        response = requests.get(url)        response.raise_for_status()        time.sleep(10)        # レスポンス HTML から記事の情報を取得する        return self.article_detail_page_parser.parse(response.text)def collect_lapras_note_articles_usecase(crawler: LaprasNoteCrawler):    """    LAPRAS NOTE の記事のデータを全て取得してファイルに保存する    """    print("Start crawl LAPRAS NOTE.")    article_list = crawler.crawl_lapras_note_articles()    output_json_path = "./articles.json"    with open(output_json_path, mode="w") as f:        print(f"Start output to file. path: {output_json_path}")        article_data = [dataclasses.asdict(d) for d in article_list]        json.dump(article_data, f)        print("Done output.")    print("Done crawl LAPRAS NOTE.")if __name__ == '__main__':    collect_lapras_note_articles_usecase(LaprasNoteCrawler(        article_list_page_parser=ArticleListPageParser(),        article_detail_page_parser=ArticleDetailPageParser(),    ))コードはこちらに置いています。https://github.com/Chanmoro/lapras-note-crawler/blob/master/advanced/crawler.pyこのように parser, crawler, usecase の3つの層に分離したことで、先に紹介した問題に対応するために例えば以下のように変更を入れるというのがより明確になります。クロール先の HTML 構造が変化するparser のレイヤーでバリデーションを入れる、もしくは定点観測のテストを書くクロール先の障害や一時的なエラーcrawler のレイヤーで状況に応じた例外や戻り値を返すusecase のレイヤーでリトライやフローの分岐をするid が変化するcrawler からの戻り値に id が変化したことが分かる情報を付加するusecase のレイヤーで取り込み済みのデータの突合と更新ロジックを処理するまとめさて、今回の記事では「クローラーの作り方 - Advanced 編」と題して、クローラーを継続的に運用する際によく発生する問題と、それらに対応するためにどんなクローラーの設計にしておくと開発がしやすいかという内容について書きました。今回紹介したのは分かりやすさのためのほんの一例なので、実際にはクロール先サービスの特性や、クロールしたデータを使いたいサービスの要件を満たすために設計を更に工夫していく必要があると思います。しかしこのような設計はクローラーに限ったものではなく、外部サービスや API、ライブラリとのデータ連携があるシステムの一般的なデータモデリングの範囲の話がほとんどなので、クローラーを開発すればするほど、実はクローラー特有の設計というのはあまりないんじゃないか？という気がしてきています。前回の クローラーの作り方 - Basic 編 から続いて2回に渡って、これまで僕がクローラーを開発してきた経験をベースとして、クローラー開発の実際について紹介してきました。いまクローラー開発に困っている方、これからクローラーの開発をしてみたい方のお役にたてると嬉しいです！それでは皆さんもよいクローラー開発ライフをお楽しみください！

クローラーの作り方 - Advanced 編

LAPRAS アウトプットリレー1日目の記事です！こんにちは！LAPRAS クローラーエンジニアの @Chanmoro です！この度LAPRAS アウトプットリレーと題しまして、3月末まで毎日 LAPRAS のメンバーが日替わりで記事をアウトプットしていきます！昨今のコロナショックの影響で勉強会やカンファレンスが中止になってしまっていますが、今回の LAPRAS アウトプットリレーを通して少しでもエンジニアの皆さんのインプットやアウトプットするモチベーションのお役に立てればと思っています。この記事の内容さて、僕は普段クローラー開発者として仕事をしているのですが、新規にクローラーを開発する時にどういう流れで開発を進めているのかというのを今回記事にしてみようと思います。ここではサンプルとして、 LAPRAS が運営している自社メディアである LAPRAS NOTE に公開されている記事の情報を取得して JSON 形式のファイルに出力するクローラーの実装例を紹介していきたいと思います。※LAPRAS NOTE はエンジニアの方向けに、LAPRAS に関連したニュースやインタビュー記事を発信しているサイトです。クローラー開発の手順クローラーを実装する時にはざっくりと以下のような手順で調査と設計・実装を進めていきます。サイトのリンク構造と各ページの導線を調査するクロールするページの HTML 構造を調査するクローラーを実装するそれぞれ詳細を説明していきます。1. サイトのリンク構造と各ページの導線を調査するLAPRAS NOTE のページをざっと見てみると、トップページには記事の一覧が表示されていて、一覧にある記事へのリンクから各記事のページに移動するという導線になっています。ざっくりと 2 種類のページで構成されていることがわかります。記事一覧ページ記事詳細ページこれらのページの作りについてもう少し詳しく見ていきましょう。記事一覧ページを調べる記事一覧ページではこのように記事タイトル、カテゴリー、公開日、本文のダイジェストの情報と、各記事の詳細ページへのリンクが掲載されていることがわかります。またページの下の方には次ページへのページングのリンクが表示されているとわかります。現時点での最終ページである 2 ページ目へ移動すると、ここでは次ページへのリンクが表示されていないことがわかります。なので、次ページへのリンクがある場合は次のページへ移動し、リンクがなくなったらそこが最終ページだと判断すればよさそうです。記事詳細ページを調べる次に記事詳細ページの内容を見てみます。このページからは記事のタイトル、公開日、カテゴリー、記事本文が取得できることがわかります。全ての記事を取得する目的に対しては、記事詳細ページから他のページへの移動は特に考えなくてよさそうです。抽出するデータの構造をまとめる先ほどのサイトの調査から、これらのデータが抽出できそうだということが分かりました。記事タイトル公開日カテゴリー記事本文また、 LAPRAS NOTE の全ての記事に対して上記のデータを抽出するためには以下のフローでサイトを辿ればいいことが分かりました。公開されている記事の一覧ページへアクセスして記事詳細への URL を取得    1. 次ページへのリンクがあれば次ページへ移動して (1) と同様に記事詳細への URL を取得記事詳細ページへアクセスして記事の情報を取得2. クロールするページの HTML 構造を調査する次に、クロール対象のページの HTML 構造を見ることで、対象のデータをどうやって抽出するかを調査していきます。ここでは Web ブラウザの開発者ツールを利用します。公開されている記事の一覧ページ記事の一覧ページからは以下を抽出したいです。記事詳細ページのリンク URL次ページへのリンク URL記事詳細ページのリンク URL を取得するまずは記事詳細ページへのリンクを探すために、1つの記事と対応している要素を見つけます。ページの HTML 構造を見ると、 post-item の class がセットされた div 要素が1つの記事の範囲と対応していることが分かりました。また、該当の div.post-item の中の要素をみていくと、 h2 タグの直下にある a タグに記事詳細ページの URL がセットされていることが分かります。この取得したい a タグを指定するための CSS パスは div.post-item h2 > a ということになります。今の予想では記事一覧の 1 ページ目ではこの CSS パスにマッチする要素は 10 件取得できるはず ですが、他に関係ない URL が取得されないかを確認したいです。例えば以下のような JavaScript のコードをブラウザのコンソールから実行してみて、 CSS セレクタにマッチする件数を確かめることができます。document.querySelectorAll("#main div.post-item h2 > a").length実際に、記事一覧ページの 1 ページ目を表示した状態でブラウザのコンソールから以下を実行すると 10 という結果が得られるので、先ほどの CSS パスで問題なさそうということが確認できました。次ページへのリンク URL を取得する次に、記事一覧ページの次ページへのリンク URL を探します。nav.navagation.pagination の要素を見ると、ここが各ページへのリンクや次ページへのリンクを表示している領域だということが分かります。この要素の中にある next と page-numbers の class を持った a タグに次ページへのリンク URL がセットされていることが分かります。こちらを取得するための CSS パスは nav.navigation.pagination a.next.page-numbers ということになります。こちらもブラウザのコンソールから実際に取得できる件数を調べてみます。document.querySelectorAll("nav.navigation.pagination a.next.page-numbers").length実行すると 1 と結果が得られたので目的のリンク URL が取得できているということで大丈夫そうです。また、最終ページである 2 ページ目では次ページへのリンクの要素が表示されていないことが確認できます。念のためコンソールから次ページへのリンクの要素を検索しても 0 の結果が得られました。記事詳細ページ記事詳細ページからは以下を抽出したいです。タイトル公開日カテゴリー記事本文先ほどと同様に HTML 構造を調べて目的の要素への CSS パスを調べます。手順は先ほどと同じなので省略しますが、以下の要素からデータを抽出すればよいことが分かりました。タイトルh1公開日article header div.entry-metaカテゴリーarticle header div.entry-meta a記事本文article div.entry-content3. クローラーを実装するここまで調査した内容でクロールのためのロジックはほぼ明らかになっているのでそれをコードで実装していきます。実装する言語は何を使ってもほとんどの場合で問題ありませんが、ここでは Python での実装例を書いていきたいと思います。やることを整理まずはベタにやることを列挙してみます。# TODO: https://note.lapras.com/ へアクセスする# TODO: レスポンス HTML から記事詳細の URL を取得する    # TODO: 次ページのリンクがあれば取得する# TODO: 記事詳細ページへアクセスする# TODO: レスポンス HTML から記事の情報を取得する    # TODO: URL    # TODO: タイトル    # TODO: 公開日    # TODO: カテゴリー    # TODO: 記事本文# 取得されたデータを JSON 形式でファイルに保存するクローラー実装時の注意点実装時の注意点としては、クロール先サービスへ過度な負荷をかけないように適宜 sleep を入れてアクセスする間隔を調整します。たいていの場合は目安として多くても1秒あたり1リクエスト程度に収まるようにしておくのがよいと思いますが、クロールにより対応先サービスをダウンさせてしまったりすると問題になるので、クロール先からのレスポンスがエラーになっていないかは常に確認するようにしましょう。Python でベタに実装するPython の場合は requests と Beautiful Soup を組み合わせてクローラーを書くことが多いです。ライブラリの使い方は 10分で理解する Beautiful Soup も参考にしてみてください。Scrapy などのクローラーを実装するフレームワークも存在していますが、クローラーの全体像を理解するためにはまずフレームワークを使わずに実装してみるのがオススメです。一旦設計を深く考えずに、書きたい処理をベタにコードで表すとこんな感じになります。import jsonimport timeimport requestsfrom bs4 import BeautifulSoupdef parse_article_list_page(html):    """    記事一覧ページをパースしてデータを抜き出す    :param html:    :return:    """    soup = BeautifulSoup(html, 'html.parser')    next_page_link = soup.select_one("nav.navigation.pagination a.next.page-numbers")    return {        "article_url_list": [a["href"] for a in soup.select("#main div.post-item h2 > a")],        "next_page_link": next_page_link["href"] if next_page_link else None    }def crawl_article_list_page(start_url):    """    記事一覧ページをクロールして記事詳細の URL を全て取得する    :return:    """    print(f"Accessing to {start_url}...")    # https://note.lapras.com/ へアクセスする    response = requests.get(start_url)    response.raise_for_status()    time.sleep(10)    # レスポンス HTML から記事詳細の URL を取得する    page_data = parse_article_list_page(response.text)    article_url_list = page_data["article_url_list"]    # 次ページのリンクがあれば取得する    while page_data["next_page_link"]:        print(f'Accessing to {page_data["next_page_link"]}...')        response = requests.get(page_data["next_page_link"])        time.sleep(10)        page_data = parse_article_list_page(response.text)        article_url_list += page_data["article_url_list"]    return article_url_listdef parse_article_detail(html):    """    記事詳細ページをパースしてデータを抜き出す    :param html:    :return:    """    soup = BeautifulSoup(html, 'html.parser')    return {        "title": soup.select_one("h1").get_text(),        "publish_date": soup.select_one("article header div.entry-meta").find(text=True, recursive=False).replace("｜", ""),        "category": soup.select_one("article header div.entry-meta a").get_text(),        "content": soup.select_one("article div.entry-content").get_text(strip=True)    }def crawl_article_detail_page(url):    """    記事詳細ページをクロールして記事のデータを取得する    :param url:    :return:    """    # 記事詳細へアクセスする    print(f"Accessing to {url}...")    response = requests.get(url)    response.raise_for_status()    time.sleep(10)    # レスポンス HTML から記事の情報を取得する    return parse_article_detail(response.text)def crawl_lapras_note_articles(start_url):    """    LAPRAS NOTE をクロールして記事のデータを全て取得する    :return:    """    article_url_list = crawl_article_list_page(start_url)    article_list = []    for article_url in article_url_list:        article_data = crawl_article_detail_page(article_url)        article_list.append(article_data)    return article_listdef collect_lapras_note_articles():    """    LAPRAS NOTE の記事のデータを全て取得してファイルに保存する    :return:    """    print("Start crawl LAPRAS NOTE.")    article_list = crawl_lapras_note_articles("https://note.lapras.com/")    output_json_path = "./articles.json"    with open(output_json_path, mode="w") as f:        print(f"Start output to file. path: {output_json_path}")        json.dump(article_list, f)        print("Done output.")    print("Done crawl LAPRAS NOTE.")if __name__ == '__main__':    collect_lapras_note_articles()実装したコードはこちらのリポジトリで公開しています。https://github.com/Chanmoro/lapras-note-crawler使い捨てコードっぽい雰囲気が漂っていますが、 Basic 編としては一旦ここまでで解説を終わりたいとおもいます。まとめさて、今回は 「クローラーの作り方 - Basic 編」 ということで、 LAPRAS NOTE のクローラー実装をテーマにして、クローラーを開発する時の一連の流れの基本を紹介しました。僕がクローラーを開発する時は今回紹介したような手順で開発を進めています。実装例にあげているコードは長期間メンテナンスし続けるクローラーとしてみるとまだまだ不足していることは多いですが、継続的にデータを更新するのではなく1回で一式のデータが取得できれば十分な場合など、簡易的な利用であればこれくらいのコードでも十分だと思います。個人的には数回程度実行すれば十分な調査用のクローラーであれば Python を使わなくてもシェルスクリプトだけで簡単に実装してしまう場合もあります。実際の仕事ではデータモデリングやクロールフローの設計、エラーの場合のハンドリングなど、継続的にクロールを繰り返してもデータが壊れないように維持するための開発にはるかに多くの時間をかけています。LAPRAS アウトプットリレーの期間中にいくつか記事を書かせていただく予定ですが、次回の僕の記事では 「クローラーの作り方 - Advanced 編」 ということで今回の記事の内容を踏まえて、長期的にメンテナンスし続けるクローラーを開発するにはここからどういうところを気をつけて設計していけばいいか？というのをご紹介したいと思っていますので、お楽しみに！明日の LAPRAS アウトプットリレー2日目は @nasum さんが書いてくれる予定です！こちらもお楽しみに！

クローラーの作り方 - Basic 編

タイトルの通り HTTP レスポンスを記録・再生できる HTTP プロキシを作りました。何が欲しかったかお仕事でクローラーの開発をしているのですが、クローラーを使ったシステム全体の E2E テストを書くために外部サービスをモックして HTTP レスポンスを返す何かが欲しいなーと常々思っていました。求めていた機能は以下の 4 つです。1. HTTP レスポンスを記録し、記録されたデータを元にレスポンスができる2. 記録されたデータは簡単に編集できて任意の HTTP レスポンスをシミュレートできる3. 特定の言語やテストフレームワークに依存させないために HTTP プロキシとして使える4. HTTPS にも対応しているテスト用途で使える HTTP クライアントをモックしてレスポンスを返すライブラリがあったり、 API レスポンスをシミュレートしてモックを作れるものは色々とあったのですがちょうどぴったり使えるものがなかなか見つからなかったので作ることにしました。ちなみに今回の目的には合わなかったんですがマイクロサービスのテストに使える mountebank という OSS があり、これも任意のレスポンスの再生ができるのでめちゃくちゃ便利そうでした。他にも JavaScript (ブラウザ、node.js) には限定されますが Polly.JS  という netflix が作っているライブラリがあり、HTTP サーバーのスタブを作って任意のレスポンスを返すようにしたり、レスポンスタイムの時間を調整できてこちらも超絶便利そうです。フィットする用途があればどちらもいつか使ってみたいです。仕組みいろいろと調べてみると mitmproxy という今回の目的に合った素晴らしい HTTP プロキシのソフトウェアを見つけました。mitmproxy の "mitm" は Man In The Middle attack (中間者攻撃) から来ており、 SSL 通信をこのプロキシで終端させることで HTTPS のリクエスト・レスポンスであっても中身を操作することができるというすごい HTTP プロキシです！ (怖)mitmproxy 自身には HTTP レスポンスの記録・再生の機能はないのですが、リクエスト受信時やレスポンス送信時などの様々なポイントに任意の Python スクリプトを差し込めるという非常に便利な機能があり拡張できるようになっているので、その機構を利用して HTTP レスポンスを記録・再生をするためのプラグインを作りました。ソースコードはこちらで公開しています。https://github.com/Chanmoro/record-and-replay-proxy簡単に使えるように Docker イメージを公開しています。https://hub.docker.com/r/chanmoro/record-and-replay-proxy使い方Docker イメージを Docker Hub で公開 しているので簡単に使うことができます。1. HTTP レスポンスの記録以下のコマンドでレコーディングモードで HTTP プロキシを起動します。$ docker run -it --rm -p 8080:8080 -v ${PWD}/response_data:/app/response_data chanmoro/record-and-replay-proxy recordここで記録されたレスポンスは /app/response_data に保存されるためローカルのディレクトリをマウントしてデータが残るようにします。2. HTTP リクエストを送る (記録)ここでは例として curl を使って https://github.com/ にアクセスした時のレスポンスを保存します。$ curl -k -x localhost:8080 https://github.com/この時 curl から SSL 通信に使われるのは mitmproxy が発行している自己証明書でデフォルトの状態でリクエストを送ると SSL の正当性チェックでエラーになるのでチェックをオフにします。※ちょっと惜しい感じがしますがここはやむなし記録された HTTP レスポンス記録された HTTP レスポンスは Docker コンテナにマウントしたカレントディレクトリの response_data に保存されます。$ tree response_dataresponse_data└── https%3A%2F%2Fgithub.com%2F # リクエスト URL がディレクトリ名になる    └── GET                     # HTTP メソッド        ├── metadata            # HTTP メソッド、リクエスト URL、HTTP レスポンスステータス        ├── response_body       # レスポンスボディ        └── response_header     # レスポンスヘッダmetadata には記録したリクエストの HTTP メソッド、リクエスト URL、HTTP レスポンスステータスが保存されます。metadata{    "url": "https://github.com/",    "method": "GET",    "status": 200}response_body にはレスポンスボディが記録されます。response_body<!DOCTYPE html><html lang="en">  <head>    <meta charset="utf-8">  <link rel="dns-prefetch" href="https://github.githubassets.com">  <link rel="dns-prefetch" href="https://avatars0.githubusercontent.com">  <link rel="dns-prefetch" href="https://avatars1.githubusercontent.com">  <link rel="dns-prefetch" href="https://avatars2.githubusercontent.com">  <link rel="dns-prefetch" href="https://avatars3.githubusercontent.com">  <link rel="dns-prefetch" href="https://github-cloud.s3.amazonaws.com">...response_header にはレスポンスヘッダが記録されます。response_headerDate: Thu, 12 Dec 2019 10:20:49 GMTContent-Type: text/html; charset=utf-8Transfer-Encoding: chunkedServer: GitHub.comStatus: 200 OKVary: X-PJAX...3. 記録した HTTP レスポンスを再生する記録した HTTP レスポンスを再生するにはリプレイモードで HTTP プロキシを起動します。/app/response_data にマウントするディレクトリは、記録されたレスポンスのデータが入っているディレクトリを指定します。$ docker run -it --rm -p 8080:8080 -v ${PWD}/response_data:/app/response_data chanmoro/record-and-replay-proxy replay4. HTTP リクエストを送る (再生)リプレイモードで HTTP プロキシを起動した状態で記録時と同様に HTTP リクエストを送ると記録されたレスポンスが帰ってきます。リプレイモード時にはプロキシから https://github.com/ にはアクセスしないためオフラインの状態で使えます。$ curl -k -x localhost:8080 https://github.com/リプレイされていることが確認できるようにレスポンスデータを編集してみます。データを以下の内容にそれぞれ編集します。metadata{    "url": "https://github.com/",    "method": "GET",    "status": 500}response_bodyThis is recorded response!response_headerDate: Thu, 12 Dec 2019 10:20:49 GMTStatus: 500 ErrorHoge: This is Hoge header.編集した通りにレスポンスが返されるか確認してみます。$ curl -v -k -x localhost:8080 https://github.com/...> GET / HTTP/1.1> Host: github.com> User-Agent: curl/7.54.0> Accept: */*> < HTTP/1.1 500 Internal Server Error< Date: Thu, 12 Dec 2019 10:20:49 GMT< Status: 500 Error< Hoge: This is Hoge header.< content-length: 26< * Connection #0 to host localhost left intactThis is recorded response!HTTP ステータス、レスポンスヘッダ、レスポンスボディがそれぞれ編集した内容の通りになっていることがわかりますね。最高！まとめこの記事では作った HTTP レスポンスを記録・再生できる HTTP プロキシ record-and-replay-proxy についての機能と使い方をご紹介しました。これで外部サービスや API にアクセスする機能のテストが簡単にできるようになります。ぜひ使ってみてください！

HTTP レスポンスを記録・再生できる HTTP プロキシを作った

SeleniumとはSelenium は Web ブラウザの操作を自動化するためのフレームワークです。2004 年に ThoughtWorks 社によって Web アプリケーションの UI テストを自動化する目的で開発されました。https://selenium.dev/history/元々は Web アプリケーションの UI テストや JavaScript のテストの目的で開発されましたが、テスト以外にもタスクの自動化や Web サイトのクローリングなど様々な用途で利用されています。この記事では Python で Selenium を介して Chrome を操作するための環境構築と基本的な使い方について説明します。TL;DR公式の Docker イメージ (https://github.com/SeleniumHQ/docker-selenium) を使うと環境構築が超簡単ブラウザをどう操作するかをコードで書いて自動化するクローラーの用途でも使える環境構築Selenium を使ってブラウザを自動で操作するには以下をインストールする必要があります。Web ブラウザChrome, Firefox, IE, Opera などWebDriverブラウザを操作するための API を公開するモジュール SeleniumWebDriver と通信しプログラムからブラウザを操作するライブラリここでは Python で Selenium を使う場合の環境構築について、Docker を使ったやり方とローカル PC に直接環境を作るやり方の2種類をそれぞれ紹介します。(方法1) Doceker で環境構築Selenium が公式に公開している Selenium Server の Docker イメージを使うととても簡単にセットアップできます。https://github.com/SeleniumHQ/docker-seleniumこちらの方法ではこのような構成になり、ブラウザと Remote WebDriver は Docker コンテナ上で動きます。Selenium は別のホストからネットワーク越しに Remote WebDriver に接続しブラウザを操作します。※Selenium 公式サイトより引用WebDriver はブラウザのバージョンに合ったバージョンを選ばないと動作しないという若干面倒な問題があるのですが、公式の Docker イメージにはブラウザと WebDriver が動作するバージョンの組み合わせでインストール済みなのですぐに使えます。個人的にはこの方法がセットアップが楽で一番オススメです。Chrome と WebDriver をインストール以下のコマンドを実行するだけで Selenium から操作できる Chrome の環境が起動します。$ docker run -d -p 4444:4444 -v /dev/shm:/dev/shm selenium/standalone-chrome:3.141.59-xenonPython の Selenium バインディング をインストールSelenium の Python コードを動かすマシンに Selenium を使うためのライブラリをインストールします。Python の Selenium バインディングは pip でインストールできます。$ pip install selenium動かしてみる以下のようなコードで Python から Selenium を動かすことができます。webdriver.Remote を使うところに注意しましょう。from selenium import webdriver# Chrome のオプションを設定するoptions = webdriver.ChromeOptions()options.add_argument('--headless')# Selenium Server に接続するdriver = webdriver.Remote(    command_executor='http://localhost:4444/wd/hub',    desired_capabilities=options.to_capabilities(),    options=options,)# Selenium 経由でブラウザを操作するdriver.get('https://qiita.com')print(driver.current_url)# ブラウザを終了するdriver.quit()(方法2) ローカルに環境構築次に、Mac のローカル上で Selenium を動かす場合の環境構築方法を書きます。こちらの方法ではこのような構成で、ブラウザと WebDriver が全てローカル上で動いていて、Selenium はローカルの Driver に接続します。※Selenium 公式サイトより引用Chrome をインストールもう既に Chrome が入っている方も多いかもしれませんが普通に Chrome をインストールします。そしてインストールする WebDirver のバージョンを決めるために、インストールされている Chrome のバージョンを確認します。僕の環境では 78.0.3904.108 がインストールされていました。WebDriver をインストールChrome の WebDriver のバイナリをダウンロードします。Python では chromedriver-binary という、 WebDriver のバイナリのダウンロードとパスの設定をやってくれる便利なライブラリを公開してくれている方がいるのでこれを使います。Chrome のバージョンと対応した WebDriver をインストールする必要があるので、 pip で以下のようにメジャーバージョンのみ指定して WebDriver をインストールします。$ pip install chromedriver-binary==78.*Python の Selenium バインディング をインストールPython の Selenium バインディングは pip でインストールします。$ pip install selenium動かしてみるローカル環境では以下のようなコードで Selenium を動かすことができます。import chromedriver_binary # nopafrom selenium import webdriver# WebDriver のオプションを設定するoptions = webdriver.ChromeOptions()options.add_argument('--headless')print('connectiong to remote browser...')driver = webdriver.Chrome(options=options)driver.get('https://qiita.com')print(driver.current_url)# ブラウザを終了するdriver.quit()先ほどの Docker での例と比べると WebDriver に Chrome クラスを指定している点が違います。上記のコードを実行すると PC で Chrome が起動します。options.add_argument('--headless') の部分をコメントアウトすると、ブラウザの画面が表示され動いている様子を見て確認できます。基本的な使い方さて Selenium を使うための環境構築ができるようになったので実際にどのように使うのかを見ていきましょう。やりたいことそれでは Selenium で Chrome を動かして以下のような操作をやってみます。Qiita の Chanmoro のプロフィールページにアクセスするhttps://qiita.com/Chanmoro「最近の記事」に表示されている記事一覧の 2 ページ目に移動する2 ページ目の一番最初に表示されている記事のタイトルを URL を取得して表示するPython で Selenium を動かすここでは冒頭の環境構築で紹介した Docker での Selenium Server を使うことにします。ローカルの環境であっても WebDrive をセットアップする部分が違うのみで、それ以降の操作については同じコードで動かせます。まず先にコードの全体をお見せします。from selenium import webdriverfrom selenium.webdriver.common.by import By# x. Chrome の起動オプションを設定するoptions = webdriver.ChromeOptions()options.add_argument('--headless')# x. ブラウザの新規ウィンドウを開くprint('connectiong to remote browser...')driver = webdriver.Remote(    command_executor='http://localhost:4444/wd/hub',    desired_capabilities=options.to_capabilities(),    options=options,)# 1. Qiita の Chanmoro のプロフィールページにアクセスするdriver.get('https://qiita.com/Chanmoro')print(driver.current_url)# > https://qiita.com/Chanmoro# 2. 「最近の記事」に表示されている記事一覧の 2 ページ目に移動するdriver.find_element(By.XPATH, '//a[@rel="next" and text()="2"]').click()print(driver.current_url)# > https://qiita.com/Chanmoro?page=2# 3. 2 ページ目の一番最初に表示されている記事のタイトルを URL を取得するarticle_links = driver.find_elements(By.XPATH, '//div[@class="ItemLink__title"]/a')print(article_links[0].text)# > Python - 関数を文字列から動的に呼び出すprint(article_links[0].get_attribute('href'))# > https://qiita.com/Chanmoro/items/9b0105e4c18bb76ed4e9# x. ブラウザを終了するdriver.quit()それでは1つづつ順を追って説明していきます。x. Chrome のオプションを設定するまずは Chrome を起動する前に、 Chrome の起動オプションを設定します。オプションのクラスはブラウザ毎に別になっていて Chrome であれば ChromeOptions、 Firefox であれば FirefoxOptions のようにブラウザに対応したクラスが用意されています。Chrome では headless オプションを付けることによって画面を表示せずにブラウザが起動されます。基本的には headless モードで動かすことがほとんどだと思いますが、デバッグ中などで画面を操作する様子を目で見て確認したい場合にはこのオプションを指定せずに動かす使い方もできます。options = webdriver.ChromeOptions()options.add_argument('--headless')x. ブラウザの新規ウィンドウを開く次に Selenium から新規のウィンドウを開きます。この時ブラウザが起動していなければ起動もされます。冒頭の環境構築で紹介したように Selenium Server を利用している場合には Remote クラスを使い、ブラウザの種類の指定は desired_capabilities の引数で指定します。今回の例では options に ChromeOptions オブジェクトが入っているため Chrome を指定することになります。# NOTE: リモートで Selenium を動かす場合は以下のようにして Remote の WebDriver を指定しますdriver = webdriver.Remote(    command_executor='http://localhost:4444/wd/hub',    desired_capabilities=options.to_capabilities(),    options=options,)1. Qiita の Chanmoro のプロフィールページにアクセスするWebDriver オブジェクトの get() メソッドを呼ぶことで指定した URL にアクセスします。driver.get('https://qiita.com/Chanmoro')現在ウィンドウが表示している URL は current_url 、 表示している HTML は page_source でアクセスすることができますprint(driver.current_url)print(driver.page_source)2. 「最近の記事」に表示されている記事一覧の 2 ページ目に移動するプロフィール画面の「最近の記事」の下の方に表示されている 2 ページ目に移動するリンクをクリックしてページを移動します。Selenium では以下のように find_element で対象の要素を取得し、その要素に対して click() を呼ぶことでクリックをします。ここでは rel="next" の属性を持っていて 2 の文字列が書かれている a タグを指定してクリックしています。driver.find_element(By.XPATH, '//a[@rel="next" and text()="2"]').click()Selenium では XPath 以外にも CSS セレクタや、 ID 指定、 name 属性指定、クラス指定など様々な方法でターゲットとなる要素を指定できます。個人的には XPath がどんな要素でも強力に一発で仕留められるので一番好きです。書き方に慣れるまで最初の一瞬少しだけツライですけど。この例では find_element() に By.XPATH を指定して XPath を書いていますが、find_element_by_xpath() を使って XPath を指定してもやっていることは同じです。要素を指定するためのメソッドについて詳しくはこちらのドキュメントをご確認ください。https://selenium-python.readthedocs.io/locating-elements.html3. 2 ページ目の一番最初に表示されている記事のタイトルを URL を取得する今度は find_elements() で指定した要素を複数取得します。クリックの時に使った find_element() は指定した条件にマッチする要素が最初の1つだけ返されるのですが、 find_elements() では複数マッチする場合でも要素の配列が返されます。プロフィールページでは一覧にある記事タイトルの要素のクラスに ItemLink__title が付与されているのでそこを頼りに記事タイトルの一覧を取得しました。article_links = driver.find_elements(By.XPATH, '//div[@class="ItemLink__title"]/a')取得された要素に対して text でそのタグ内に書かれているテキストを取得でき、href などの属性は get_attribute() で取得できます。print(article_links[0].text)print(article_links[0].get_attribute('href'))x. ブラウザを終了する最後に処理が完了したら quit() を呼んでブラウザを終了します。driver.quit()Selenium の処理中にエラーが発生した場合などで quit() を呼ぶのを忘れているとブラウザが起動したままになりメモリの消費がどんどん増えていくようなバグにも繋がるので、 try-catch などでエラーハンドリングをして必ずプログラムの終了時に quit() を呼ぶようにしましょう。(Tips) Selenium を使ってクローラーを作るSelenium はクローラーの用途でも使うことができます。JavaScript による描画の実行やボタンをクリックする操作に Selenium を使い、表示されたページに対して何らかの HTML パーサーを使って要素を取得します。パース処理は Selenium 自体で用意されている HTML パーサーを使うこともできますが、 BeautifulSoup などライブラリを使った方がパースに便利な機能がついていますしより柔軟に実装できるのでオススメです。具体的には以下のコードのように driver.page_source で取得した HTML をパースしてデータを取得します。from bs4 import BeautifulSoupfrom selenium import webdriveroptions = webdriver.ChromeOptions()options.add_argument('--headless')driver = webdriver.Remote(    command_executor='http://localhost:4444/wd/hub',    desired_capabilities=options.to_capabilities(),    options=options,)driver.get('https://qiita.com/Chanmoro')# ブラウザに表示されている HTML から BeautifulSoup オブジェクトを作りパースするsoup = BeautifulSoup(driver.page_source, 'html.parser')articles = soup.select('.ItemLink')for article in soup.select('.ItemLink'):    # プロフィールページに表示されている記事タイトルの一覧を取得    print(article.select_one('.ItemLink__title a').get_text())driver.quit()BeautifulSoup の使い方については 「10分で理解する Beautiful Soup」 という素晴らしい記事があるのでこちらも併せてお読みください！ (うざい)https://qiita.com/Chanmoro/items/db51658b073acddea4acまとめさて、今回の記事では Selenium の環境設定と基本的な使い方についてご紹介しました。Docker を使って環境構築をするのがすごく簡単ですが、ローカル PC 上で環境を作るのもそれほど難しくないのでどちらの方法でもすぐに試せます。Selenium は UI テストやブラウザ操作の自動化はもちろんのこと、最後に少し紹介したような JavaScript で描画される SPA のようなサイトをクロールする場合にも使えます。また UI テストの目的では、複数の種類のブラウザでのテストを同時に動かすことができる Selenium Grid という非常に便利な仕組みがあります。Selenium Grid は Chrome, Firefox, IE などの複数種類のブラウザや複数バージョンのブラウザをプールしておき、Hub を経由してそれらの複数のブラウザで並行して同じテストを実行することができるというすごい仕組みです。※Selenium 公式サイトより引用Selenium Grid も docker を使って簡単に環境が作れるようになっているので、詳しくは Selenium Grid のドキュメントや docker-selenium の README をぜひご確認ください。https://selenium.dev/documentation/en/grid/https://github.com/SeleniumHQ/docker-selenium今回この記事を書くにあたり Selenium の歴史 を読んで初めて ThoughtWorks 社のエンジニアが最初に Selenium のコンセプトとコアとなる機能を作ったと知りました。個人的には ThoughtWorks の人が作ったっていうだけで急激にイケてる感じがしてきます。また Selenium IDE というブラウザを手動で動かしてその操作をレコーディングし再生できるというこれまた非常に便利なブラウザの拡張機能があり、これは日本人の Shinya Kasatani さん (@shinya) が開発されたそうです。Selenium は Web アプリケーション開発に革命的な影響を与えているはずですし、こういうソフトウェアを作り OSS として公開し世界中で広く利用されていることは本当にすごいですね。それでは皆さんも Selenium の使い方を理解して巨人の肩の上に立ち、今日も1日楽しいブラウザオートメーションライフをお過ごしください！

10分で理解する Selenium

Beautiful Soup とはHTML や XML から狙ったデータを抽出するためのライブラリです。公式ドキュメントの冒頭の説明を見るとこれは HTML や XML のパーサーそのものではなく、パーサーをラップして扱いやすくするライブラリのようです。Beautiful Soup is a Python library for pulling data out of HTML and XML files. It works with your favorite parser to provide idiomatic ways of navigating, searching, and modifying the parse tree. It commonly saves programmers hours or days of work.この記事では Beautiful Soup の基本的な使い方と、実践で役に立つ Tips をいくつかご紹介します。TL;DRCSS セレクターを使えばだいたいの場合で困らないget_text() めちゃ便利Scrapy と組み合わせても使える基本的な使い方インストールpip で beautifulsoup4 をインストールします。$ pip install beautifulsoup4Beautiful Soup を使ってクローラーを書くHTML の取得は requests を使い、HTML のパース処理を Beautiful Soup でやるのが基本的な使い方です。import requestsfrom bs4 import BeautifulSoup# スクレイピング対象の URL にリクエストを送り HTML を取得するres = requests.get('http://quotes.toscrape.com/')# レスポンスの HTML から BeautifulSoup オブジェクトを作るsoup = BeautifulSoup(res.text, 'html.parser')# title タグの文字列を取得するtitle_text = soup.find('title').get_text()print(title_text)# > Quotes to Scrape# ページに含まれるリンクを全て取得するlinks = [url.get('href') for url in soup.find_all('a')]print(links)# > ['/', '/login', '/author/Albert-Einstein', '/tag/change/page/1/', '/tag/deep-thoughts/page/1/', '/tag/thinking/page/1/', '/tag/world/page/1/', '/author/J-K-Rowling', '/tag/abilities/page/1/', '/tag/choices/page/1/', '/author/Albert-Einstein', '/tag/inspirational/page/1/', '/tag/life/page/1/', '/tag/live/page/1/', '/tag/miracle/page/1/', '/tag/miracles/page/1/', '/author/Jane-Austen', '/tag/aliteracy/page/1/', '/tag/books/page/1/', '/tag/classic/page/1/', '/tag/humor/page/1/', '/author/Marilyn-Monroe', '/tag/be-yourself/page/1/', '/tag/inspirational/page/1/', '/author/Albert-Einstein', '/tag/adulthood/page/1/', '/tag/success/page/1/', '/tag/value/page/1/', '/author/Andre-Gide', '/tag/life/page/1/', '/tag/love/page/1/', '/author/Thomas-A-Edison', '/tag/edison/page/1/', '/tag/failure/page/1/', '/tag/inspirational/page/1/', '/tag/paraphrased/page/1/', '/author/Eleanor-Roosevelt', '/tag/misattributed-eleanor-roosevelt/page/1/', '/author/Steve-Martin', '/tag/humor/page/1/', '/tag/obvious/page/1/', '/tag/simile/page/1/', '/page/2/', '/tag/love/', '/tag/inspirational/', '/tag/life/', '/tag/humor/', '/tag/books/', '/tag/reading/', '/tag/friendship/', '/tag/friends/', '/tag/truth/', '/tag/simile/', 'https://www.goodreads.com/quotes', 'https://scrapinghub.com']# class が quote の div 要素を全て取得するquote_elms = soup.find_all('div', {'class': 'quote'})print(len(quote_elms))# > 10※本記事のサンプルコードでは Scrapy のチュートリアルで利用されている http://quotes.toscrape.com/ に対してアクセスしてます。クロールする場合はクロール先サイトの robots.txt や利用規約をよく確認して行いましょう。実践で使える TipsBeautiful Soup を使ってスクレイピングをする場合に、個人的にどういう使い方をしているかをいくつかサンプルでご紹介します。CSS セレクターを使って抽出Beautiful Soup のチュートリアルや色々なサンプルでは find_xxx 系のメソッドがよく使われていますが、個人的には CSS セレクターを使う場面がほとんどです。CSS セレクターを使って要素を取得したい場合、複数の要素を取得する場合は select() 1つだけ取得する場合は select_one() を使うことができます。# CSS セレクターを使って author を全て取得するauthor_names = [n.get_text() for n in soup.select('div.quote small.author')]print(author_names)# > ['Albert Einstein', 'J.K. Rowling', 'Albert Einstein', 'Jane Austen', 'Marilyn Monroe', 'Albert Einstein', 'André Gide', 'Thomas A. Edison', 'Eleanor Roosevelt', 'Steve Martin']ページによってその要素が存在するかしないかが分からないけども、存在するページの場合は取得したいという場面がよくあります。その場合に find 系のメソッドの条件では要素を1つづつ指定する必要がありますが、 CSS セレクターの場合は階層を一括で指定する事ができるので、どの要素を取得しようとしているかがパッで分かりやすいですし、途中の要素が存在しなかった場合のハンドリングがシンプルになるのでこちらの方がわかりやすいと感じます。def get_piyo_text():    piyo = soup.select_one('div.hoge div.fuga div.piyo')    if not piyo:        return None    return piyo.get_text()実際のスクレイピングのコードではこのようなパターンはとてもよく使うので、CSS セレクターを使うとこういった場合に特に便利に感じます。公式ドキュメントの CSS selectors のセクションも併せて見てみてください。https://www.crummy.com/software/BeautifulSoup/bs4/doc/#css-selectorsテキストを起点に抽出する世の中にある様々な Web サイトは ID やクラスを適切に指定してくれている綺麗な構造のサイトばかりではないので、サイトによっては「テーブルの1列目にXXと書いてある次の列のテキストを取得する」というような抽出が必要になる場合もよくあります。http://quotes.toscrape.com/ のページの右側にある Top Ten tags のタイトルの下にあるタグ名を取得してみるのをこの方法でやってみます。Top Ten tags のところの HTML を見てみましょう。<div class="col-md-4 tags-box">            <h2>Top Ten tags</h2>            <span class="tag-item">            <a class="tag" style="font-size: 28px" href="/tag/love/">love</a>            </span>            <span class="tag-item">...テキストに Top Ten tags と書かれている h2 要素と横並びになっている span 要素を取得すれば目的のタグ名が取得できる事がわかります。これを取得する CSS セレクターは h2:contains("Top Ten tags") ~ span となります。Beautiful Soup は関係なく一般的な CSS セレクターの書き方ですが、 :contains() を使うと指定したテキストを含む要素が取得でき、同じ階層の隣接ノードにアクセスするには ~ を使います。これらを使って以下のように書くと目的のタグ名が全て取得できます。tag_items = soup.select('h2:contains("Top Ten tags") ~ span')print([t.get_text(strip=True) for t in tag_items])# > ['love', 'inspirational', 'life', 'humor', 'books', 'reading', 'friendship', 'friends', 'truth', 'simile']※本来は span.tag-item だけで取得できるのでサンプルのためにあえて遠回りなことをやっていますがテキストを取得するここまでのサンプルでも使っていますが、指定した要素に含まれるテキストを取得するには get_text() を使います。これが地味にめちゃくちゃ便利で、テキストに含まれる改行やスペースをトリムしたり、複数の要素を任意の文字列で結合する事ができます。改行、空白文字をトリムする例えば以下のサンプルのように取得するテキストによっては前後に改行やスペースが含まれている場合があります。html = '<div>\n   aaa\n  </div>'soup = BeautifulSoup(html, 'html.parser')soup.find('div').get_text()# > '\n   aaa\n  'この時 get_text() の引数に strip=True を指定するとテキストに含まれる改行や空白文字を除去してくれます。soup.find('div').get_text(strip=True)# > 'aaa'指定した要素の属性を取得する指定した要素の属性を取得するには要素に対して element['attr_name'] のように要素名を指定して取得ができます。html = """<a href="http://hoge.hoge">リンクテキスト</a>"""soup = BeautifulSoup(html, 'html.parser')# href を取得するsoup.find('a')['href']# > 'http://hoge.hoge'# リンクのテキストを取得するsoup.find('a').get_text()# > 'リンクテキスト'複数のテキストを別々に取得する指定した要素の .stripped_strings のプロパティを使うと、小要素に含まれるテキストを1つづつ返すジェネレーターを取得することができます。# 戻り値はジェネレーターで取得されますsoup.find('div').stripped_strings# > <generator object Tag.stripped_strings at 0x10677d750># list に変換するか for でイテレーションすることでテキストを1つづつ利用できますlist(soup.find('div').stripped_strings)# > ['text1', 'text2', 'text3']これらとても細かいですが実際のスクレイピングではよく使う処理だと思うので覚えておくととても便利です。公式ドキュメントの get_text() のセクションも併せて見てみてください。https://www.crummy.com/software/BeautifulSoup/bs4/doc/#get-textScrapy と Beautiful Soup を組み合わせて使うScrapy と Beautiful Soup を組み合わせて使うのも簡単にできます。コールバックで呼ばれる parse メソッドの中でレスポンスの内容を取得して BeautifulSoup オブジェクトを生成することでこれまでと同様に使うことができます。import scrapyfrom bs4 import BeautifulSoupclass QuotesSpider(scrapy.Spider):    name = "quotes"    start_urls = [        'http://quotes.toscrape.com/page/1/',    ]    def parse(self, response):        # レスポンスから BeautifulSoup オブジェクトを生成する        soup = BeautifulSoup(response.text, 'html.parser')        # 通常の Beautiful Soup と同じように使うことができる        title_text = soup.find('title').get_text(strip=True)例えばクローリングとスクレイピングの責務を明確に分けて以下のように Parser クラスを別にする設計にすることもできます。class Parser(object):    def __init__(self, html: str):        self._soup = BeautifulSoup(html, 'html.parser')    def parse_title(self):        return self._soup.find('title').get_text(strip=True)class QuotesSpider(scrapy.Spider):    name = "quotes"    start_urls = [        'http://quotes.toscrape.com/page/1/',    ]    def parse(self, response):        # レスポンスから Parser オブジェクトを生成する        parser = Parser(response.text)        title_text = parser.parse_title()この場合 Parser 単体でテストできるようになりますしクローリングとスクレイピングのそれぞれを修正する場合に影響範囲が明確になりかなりメンテナンスがし易くなるのでオススメです。まとめさて、今回は Beautiful Soup の使い方についてざっくりと説明しました。今回紹介した方法の他にも正規表現を使って要素を取得することもできたりとスクレイピングに必要な処理は一通り揃っています。https://www.crummy.com/software/BeautifulSoup/bs4/doc/#a-regular-expressionだいたいの要素の取得には CSS セレクターを使えば取得できますが、親の階層をいくつか登ってから降りるような指定をやろうとすると少し難しいので、その場合は多少複雑になりますが .parent などを使ってツリーを辿っていく事で解決できます。https://www.crummy.com/software/BeautifulSoup/bs4/doc/#going-upこういう場合には xpath を使えれば一発で指定できて便利だったりするので lxml を使った方が簡単にできるかもしれません。また Scrapy と Beautiful Soup を組み合わせて使う方法についても紹介しました。あるサイトの全ページをスクレイピングしたい場合や特定のパターンの URL を全て走査したい場合な、 requests だけでクロール処理を書こうとすると地味に大変なので、そういった場合はクロールの処理は Scrapy を使ってスクレイピングの処理に Beautiful Soup を使うという組み合わせが便利だと思います。Scrapy についても10分で理解するシリーズを書いているのでぜひこちらも併せて読んでみください！10分で理解する Scrapyそれでは Beautiful Soup の使い方を理解して、今日も1日楽しいスクレイピングライフを！

10分で理解する Beautiful Soup

mock.patch を使って一部のモジュールをモックに差し替えてテストをする際に、モックに変えたい箇所が思った通りに適用されずにハマったことってありませんか？この記事では mock.patch を使ってモジュールをモックに差し替える時に、 patch によってどこがモックに変わるのか挙動を見てみましょう。TL;DRimport hoge と import されているモジュールの hoge.fuga を patch するには hoge.fuga を指定するfrom hoge import fuga と import されている fuga を patch するには <モジュール名>.fuga を指定する動作確認用のモジュールを用意するpatch の動作を確かめるためにまずこのようなモジュールを用意します。some_module.pyimport osfrom os import listdirdef some_func():    print('os.listdir(): ', os.listdir('.'))    print('listdir(): ', listdir('.'))図で書くとこんなイメージです。そして some_func() を実行する以下のようなテストを用意します。test.pyfrom some_module import some_funcclass TestCase(unittest.TestCase):    def test_some_func(self):        some_func()このテストを実行してみると以下のような出力になります。テストの実行結果$ python -m unittest test.py os.listdir():  ['__pycache__', 'test.py', 'some_module.py']listdir():  ['__pycache__', 'test.py', 'some_module.py'].----------------------------------------------------------------------Ran 1 test in 0.000sOK当然ですが some_func() の中で実行されている os.listdir()、listdir() はどちらも同じ結果を返していることがわかりますね。1. patch による動作を確認するos.listdir をモックに差し替えてテストしたい場合、対象のモジュールがどのように import されているかによって patch で指定する対象を変える必要があります。1-1. os.listdir を patch してみるここでテストの内容を以下のように書き換えて os.listdir が <return from mock> という文字列を返すようにモックに差し替えてみます。test.pyimport unittestfrom unittest.mock import patchfrom some_module import some_funcclass TestCase(unittest.TestCase):    @patch('os.listdir')    def test_some_func(self, mock):        mock.return_value = '<return from mock>'        some_func()これを実行すると以下の出力になります。テストの実行結果$ python -m unittest test.py os.listdir():  <return from mock>listdir():  ['__pycache__', 'test.py', 'some_module.py'].----------------------------------------------------------------------Ran 1 test in 0.001sOKos.listdir() の処理だけがモックに差し変わっていることがわかります。os.listdir の参照先がモックに差し代わり、 some_module.listdir は影響を受けません。1-2. some_module.listdir を patch してみる今度は some_module.listdir を <return from mock> という文字列を返すモックに差し替えてみましょう。test.pyimport unittestfrom unittest.mock import patchfrom some_module import some_funcclass TestCase(unittest.TestCase):    @patch('some_module.listdir')    def test_some_func(self, mock):        mock.return_value = '<return from mock>'        some_func()これを実行すると以下の出力になります。テストの実行結果$ python -m unittest test.py os.listdir():  ['__pycache__', 'test.py', 'some_module.py']listdir():  <return from mock>.----------------------------------------------------------------------Ran 1 test in 0.001sOK今度は listdir() の処理だけがモックに差し変わっていることがわかりますね。今度は some_module.listdir の参照先がモックに差し変わるので、os.listdir の参照先は影響を受けません。2. 複数のモジュールから利用されているモジュールを patch するさて、今度は os.listdir が複数のモジュールから利用されている場合に patch の対象によってどのような挙動になるか見てみましょう。os.listdir を使うモジュール some_module.py と some_module_2.py を用意します。some_module.pyimport osfrom os import listdirdef some_func():    print('some_func', 'os.listdir(): ', os.listdir('.'))    print('some_func', 'listdir(): ', listdir('.'))some_module_2.pyimport osfrom os import listdirdef some_func_2():    print('some_func_2', 'os.listdir(): ', os.listdir('.'))    print('some_func_2', 'listdir(): ', listdir('.'))図で書くとこんな感じです。2-1. os.listdir を patch するテストから some_func() some_func_2() の両方が実行されるようにして、 os.listdir を patch してみます。test.pyimport unittestfrom unittest.mock import patchfrom some_module import some_funcfrom some_module_2 import some_func_2class TestCase(unittest.TestCase):    @patch('os.listdir')    def test_some_func(self, mock):        mock.return_value = '<return from mock>'        some_func()        some_func_2()これを実行すると以下の出力になります。実行結果$ python -m unittest test.py some_func os.listdir():  <return from mock>some_func listdir():  ['__pycache__', 'test.py', 'some_module.py', 'some_module_2.py']some_func_2 os.listdir():  <return from mock>some_func_2 listdir():  ['__pycache__', 'test.py', 'some_module.py', 'some_module_2.py'].----------------------------------------------------------------------Ran 1 test in 0.001sOKsome_module some_module_2 の両方で os.listdir() の処理がモックに差し変わっていることがわかりますね。os.listdir の参照先がモックに差し代わることで、some_module some_module_2 の両方とも影響を受けます。2-2. some_module.listdir を patch する今度は some_module.listdir を patch します。test.pyimport unittestfrom unittest.mock import patchfrom some_module import some_funcfrom some_module_2 import some_func_2class TestCase(unittest.TestCase):    @patch('some_module.listdir')    def test_some_func(self, mock):        mock.return_value = '<return from mock>'        some_func()        some_func_2()これを実行すると以下の出力になります。実行結果$ python -m unittest test.py some_func os.listdir():  ['__pycache__', 'test.py', 'some_module.py', 'some_module_2.py']some_func listdir():  <return from mock>some_func_2 os.listdir():  ['__pycache__', 'test.py', 'some_module.py', 'some_module_2.py']some_func_2 listdir():  ['__pycache__', 'test.py', 'some_module.py', 'some_module_2.py'].----------------------------------------------------------------------Ran 1 test in 0.001sOK今度は some_module 内の listdir() の処理だけがモックに差し変わっていることがわかります。some_module_2 内の listdir() の処理には影響がないことが確認できます。some_module.listdir の参照先だけがモックに差し変わるので、 some_module_2.listdir は影響を受けません。まとめこれまで確認した挙動から、モックに差し替えたい対象のモジュールがどのように import されているかによって patch する対象の名前空間を変える必要があるということがわかりました。from hoge import fuga としている場合は、そのモジュール内から直接 fuga への参照を持っていることに注意しましょう。これまで patch の挙動をちゃんと理解してなかったのですが、この記事を読んで「なるほど！」となったので備忘のためにまとめてみました。https://nedbatchelder.com//blog/201908/why_your_mock_doesnt_work.html※書いてみて、 patch というよりは import と from import の挙動の違いじゃね？と思ってきましたが・・・！patch の動きを理解して楽しくテストしよう！

Python の mock.patch のハマりやすい挙動についてまとめる

避けられないアプリケーションのエラー監視アプリケーションを運用する上でエラー監視は避けて通れませんよね。とはいえ、エラー監視のツールやサービスは今やたくさんあるので、どれを使ったらいいか迷うところでもあります。僕はお仕事で Sentry を使っているのですが、これまでエラー監視ができてなかった処理に Sentry での監視を追加したらめちゃくちゃ簡単すぎて感動を覚えたのでご紹介します。この記事では python での設置についてだけ書きますが、 Sentry が対応している言語であれば基本的に同じようなやり方で設定できるようになっていると思います。Sentry の設定方法1. sentry-sdk のインストールsentry-sdk を pip でインストールします。$ pip install --upgrade sentry-sdk2. Sentry の設定以下のコードをプログラムの実行時に必ず呼ばれるどこかに記述します。例えば設定ファイルを扱うパッケージの __init__.py の中に書くのがいいかと思います。import sentry_sdksentry_sdk.init('< DSNの値 >')なんと、たったこれだけでエラー監視の設定ができます！あとはエラーが起きるのを待つだけ。※エラーが出ないのが一番いいんだけど・・・エラー通知を試してみるエラー通知を試すために以下のようなプログラムを実行してみます。sentry_test.pyimport loggingimport sentry_sdk# sentry sdk 初期化sentry_sdk.init('< DSNの値 >')# ログを出力logging.debug('DEBUG レベルのログ')logging.info('INFO レベルのログ')logging.warning('WARN レベルのログ')logging.error('ERROR レベルのログ')# 例外raise Exception('this is exception.')すると Sentry の画面をみると以下のように、 ERROR レベルのログと例外の2つのエラーが通知されたことがわかります。BREADCRUMBS の箇所にエラーが発生するまでに出力されたログが表示されます。例外の通知の場合は例外が発生するまでのスタックトレースも一緒に表示されます。※ ERROR ログの場合でもスタックトレースを表示できるので、後の方にやり方を書いてます。logger の設定がデフォルトのままだと WARN レベル以上のログしか表示されませんが、これは設定を変えれば DEBUG のログを出すこともできます。めちゃ便利！Sentry の issueERROR レベルのログ例外ERROR レベルのログでもスタックトレースを表示する以下のように logger.error() の引数に exc_info=True を指定すると ERROR ログの通知の場合でもスタックトレースが sentry で表示されるようになります。sentry_test.pyimport loggingimport sentry_sdk# sentry sdk 初期化sentry_sdk.init('< DSNの値 >')# ログを出力logging.debug('DEBUG レベルのログ')logging.info('INFO レベルのログ')logging.warning('WARN レベルのログ')logging.error('ERROR レベルのログ', exc_info=True)# 例外raise Exception('this is exception.')最高じゃん！まとめとりあえず sentry_sdk.init() を呼んでおけばエラー通知が使えるというこのお手軽さがまじで最高じゃないですか？？？エラー通知以外にもなんらか検知したいイベントの通知や、sentry 上で見たい情報をいろいろ付け足すこともできます。とにかくめちゃ便利です。強いて欠点をあげるなら、 Sentry から送られてくるエラー通知の数に上限が設定されていて、その上限を上げるには課金が必要なくらい。でもここまでのクオリティのサービスなら課金するに値する価値が十分にあると思います。さあ、あなたも今日から Sentry を始めよう！https://docs.sentry.io/error-reporting/quickstart/?platform=python

エラー監視には Sentry が超便利！

はじめに最近のお仕事ではクローラーを開発するためのフレームワークである scrapy を使ってクローラーの開発をしています。かつて趣味でクロールをやってみていたとき は色々なコマンドを組み合わせてなんとかやっていたのですが、それと比べると scrapy は遥かに強力で便利なフレームワークだなと日々実感しています・・・。例えば、 https://blog.scrapinghub.com/ をクロールして投稿されている記事のタイトルとURLをページングもしながら全て取得する処理はたったこれだけのコードで書けます。    def parse(self, response):        for post in response.css('div.post-item'):            yield Page(                url=post.css('div.post-header h2 a::attr(href)').extract_first(),                title=post.css('div.post-header h2 a::text').extract_first()            )        next_page = response.css('div.blog-pagination a.next-posts-link::attr(href)').extract_first()        if next_page:            yield scrapy.Request(next_page, self.parse)さて、そんな便利な scrapy なのですが、 クロールして抽出したデータをどこにどうやって格納するか？はこのフレームワークの範疇ではなく面倒を見てくれません。DB にデータを保存するとかをどのように実装したらいいか、恐らく scrapy ユーザーの方々は同じような課題にぶつかるはずですが、ググってもあまり情報が出てこないようでした。そこで今回は、scrapy で抽出したデータを ORM を使って DB に保存するやり方を試行錯誤してみた のでそれについて書きたいと思います。ここからは scrapy を何となくしている人向けに書いてしまいます。scrapy を使ったクローラーの実装についての基本的なところが知りたい方はこちらの記事も読んでみてください。↓↓↓↓10分で理解する Scrapyscrapy について簡単におさらいさて、それではまず scrapy のアーキテクチャーについておさらいします。scrapy の説明でよく引用される図なのですが、公式ドキュメントにはこのようなアーキテクチャー図が掲載されています。scrapy は クロールの並列実行や抽出したデータの流れを制御することがメイン となっているので、HTML のパースや抽出したデータのハンドリングなどは自由度が高くカスタマイズができるような設計になっています。データのチェックや出力の処理を入れるための item pipeline という枠だけ用意されており、あとはそれぞれ好きに使ってくれというスタンスです。※上記の構成図では (8) から左側の ITEM PIPELINES と書かれているところです。scrapy を使う上で感じたつらみ色々な情報をググってみると、独自の pipeline を実装してその中で DB への接続や SQL の実行をしている例がいくつか見つかります。例えば、こちらの記事の実装が非常にシンプルでわかりやすいです。https://ohke.hateblo.jp/entry/2018/07/07/230000これと同じようなやり方で実装をしていたのですが、何らか DB に関わる処理が増えたりすると mysqlclient を使って DB とのコネクションやトランザクションの処理を1つ１つ書くことが結構つらく感じてきます。また、クローラーを継続して開発し続けていくことを考えると、多くの Web フレームワークで一般的になってきているようにモデルの定義と DB のスキーマの定義もコードで管理したくなってきます。そしていつしか scrapy でも ORM が使えたら嬉しいのになああああ と思うようになっていました。scrapy で ORM を使おう！ざっくりとこんな感じのことがやりたかったのです。理想は scrapy の Item か ORM のモデルを定義すればあとは自動生成してくれると非常に嬉しいですよね。scrapy の公式ドキュメントでは、 scrapy の item を拡張して Django の model と連携できる DjangoItemという プラグインが紹介されています。https://github.com/scrapy-plugins/scrapy-djangoitemただこのプラグインでは、Django の model を定義した上で scrapy の item も同じ項目で2重に定義する必要があったり、ベースとなる Django のプロジェクトを作る必要があったりと、やりたいことのイメージとちょっと違いました。なので普通に ORM を組み込むやり方を探すことにしました。python の ORM ライブラリたちこれまで Python の ORM は Django のものと Peewee を少ししか使ったことがなく、他にどんな ORM が使われているのかを awesome-python で見てみました。https://github.com/vinta/awesome-python#ormざっとそれぞれ単体でどんな感じかを使ってみたところ、Orator がセットアップも簡単でシンプルに使えそうだったのでこれを使ってみることにしました。※あとドキュメントが他のと比べるとめちゃカッコいいというところも気に入りましたscrapy に Orator を組み込むいろいろと試行錯誤をした結果無事 Oractor を使って求めていた処理を実現できるようになったので、いくつかポイントを解説していきます。Item の定義まず、保存したい対象の scrapy item を以下のように定義しました。__table_name__ __uniq_fields__ は pipeline の処理で使うように新たに追加したクラス変数ですが、そのほかのフィールドの定義は通常の item を定義する時と同じです。class Page(scrapy.Item):    __table_name__ = 'pages'    # define the uniq field names for your items here like: (Optional)    __uniq_fields__ = ['url']    # define the fields for your items here like:    url = scrapy.Field()    title = scrapy.Field()Pipeline の定義ORM の処理を差し込む箇所はこれまで通り Pipeline に実装しました。そしてこの処理の中で item に定義されている field を見て、動的に Model クラスを生成し(！) Oractor の Model オブジェクトを作成することで通常と同じように扱うようにしました。class ScrapyOrmPipeline(object):    def process_item(self, item, spider):        _table_name = getattr(item, '__table_name__', None)        _uniq_keys = getattr(item, '__uniq_fields__', {})        # Generate orator model class.        model_class = generate_model_class(type(item).__name__, item.keys(), _table_name)        # If there is a record having same keys return it, if not create new record, doing like "upsert".        model = model_class.first_or_new(**{k: item[k] for k in _uniq_keys})        # Set model attributes from item.        for attr in item.keys():            setattr(model, attr, item[attr])        model.save()        return itemModel クラスの動的生成generate_model_class ではこのように type を使ってクラスを定義しています。def generate_model_class(model_name: str, columns: List[str], table_name: str = None):    """    Generate make_item.py model class in dynamically.    :param model_name:    :param columns:    :return:    """    cls = type(model_name, (Model,), {'__fillable__': columns, '__table__': table_name})    return clsOrator では Model クラスを以下のように定義するのですが、 generate_model_class では item の Page に対応する以下と同じ Model クラスを動的に生成しているということです。class Page(orator.Model):    __fillable__ = ['url']    __table__ = 'pages'マイグレーションファイル理想をいうと item の定義からマイグレーションファイルを自動生成するようにしたかったのですが、そこまでは難しそうだったのでまずは通常通りマイグレーションファイルを作ることにしました。Page モデルに対応するテーブル作成のマイグレーションファイルは Oractor ではこう書きます。class CreatePagesTable(Migration):    def up(self):        """        Run the migrations.        """        # To set other type column,        # See https://orator-orm.com/docs/0.9/schema_builder.html#adding-columns        with self.schema.create('pages') as table:            table.increments('id')            table.string('url').unique()            table.string('title')            table.timestamps()    def down(self):        """        Revert the migrations.        """        self.schema.drop('pages')マイグレーションファイルを作成したら以下のコマンドを実行すると DB に反映されます。$ orator migration通常の Oractor では以下のように make:model コマンドに --migration オプションをつけるとマイグレーションファイルの雛形を自動で生成してくれます。$ orator make:model <モデル名> --migrationItem クラス & マイグレーションファイル の雛形の自動生成make:model コマンドを参考に oractor コマンドを拡張して、 item クラスの雛形と対応するマイグレーションファイルを自動生成するようにしてみました。$ ./make_item.sh NewItem上記を実行すると以下のように Item クラス・マイグレーションファイルの雛形が生成されます。Item クラス (NewItem)import scrapyclass NewItem(scrapy.Item):    __table_name__ = 'models'    # define the uniq field names for your items here like: (Optional)    # __uniq_fields__ = []    # define the fields for your items here like:    # name = scrapy.Field()マイグレーションファイルfrom orator.migrations import Migrationclass CreateNewItemsTable(Migration):    def up(self):        """        Run the migrations.        """        with self.schema.create('new_items') as table:            table.increments('id')            table.timestamps()    def down(self):        """        Revert the migrations.        """        self.schema.drop('new_items')ディレクトリ構成scrapy プロジェクト crawlers の配下に、 scrapy アプリケーションの crawlers と oractor のディレクトリ database を配置しました。Item クラスは前述のカスタマイズした oractor のコマンドで自動生成するようにしたので、 database の配下に置くようにしました。crawlers/├── crawlers│   ├── __init__.py│   ├── middlewares.py│   ├── orm.py│   ├── pipelines.py│   ├── settings.py│   └── spiders│       ├── __init__.py│       └── scraping_hub_spider.py├── database│   ├── __init__.py│   ├── commands│   │   ├── __init__.py│   │   ├── items│   │   │   ├── __init__.py│   │   │   ├── make_command.py│   │   │   └── stubs.py│   │   └── make_item.py│   ├── items│   │   ├── __init__.py│   │   └── page.py│   ├── make_item.sh│   ├── migrations│   │   ├── 2018_12_18_143127_create_pages_table.py│   │   └── __init__.py│   ├── orator.yml│   └── settings.py└── scrapy.cfgコード一式今回説明したソースコードの一式はこちらのリポジトリに置いています。https://github.com/Chanmoro/scrapy-ormサンプルとして https://blog.scrapinghub.com/ をクロールして、投稿されているブログ記事の URL とタイトルを全て取得して mysql に保存するという処理を実装しています。まとめさて、今回の記事では scrapy で item を DB で管理するために ORM の Oractor を組み込んでみた ということを書きました。ささーっとやってしまったのでいろいろと細かいところで不足があると思いますが、 Oractor 以外の ORM を使っても同じようなやり方で実装できそうな気がしてきました。理想は Item を定義するだけでマイグレーションファイルを全て自動生成してくれるようにできたら最高だなあと思うので、いろいろと試してみようと思うのでうまく行ったらお仕事にも使おうと思います。それでは皆さんもくれぐれもクローリングは用法用量を守って正しくお使いくださいね。ハッピースクレイピング！

Scrapy でスクレイピングしたデータを ORM で RDB に保存する

はじめにどの会社でも業務上の申請フローがあると思いますが、そういった業務フローを整備している途中のベンチャーでは様々なフローが整っていないことがよくあります。scouty でも少し前までは何か購買を依頼する時には 申請用の slack チャンネルに書き込んで、それを担当者が見て処理する というやり方をしていました。社員数が少ないうちはこのような slack だけのフローでも問題なく回せると思います。ところが最近、弊社バックオフィス担当の業務負荷が一時的に非常に高くなり明らかに大変そうにしており、そんな時に slack でのこの発言をみて 「これを運用し続けるのはどう考えても無理がある・・・！！！」 と思いました。抱えていた課題これまでに行われていた slack だけでの申請フローだとざっくりとこんなところが困っていたと思います。申請を処理する人たち申請が来ても気づかず見落としてしまう場合がある申請する人たち自分が出した申請の対応状況が担当者に聞かないと分からないこういう日々発生する 細かいところでいちいち気にしたり都度考える必要があると、ちょっとずつジワジワと頭のリソースが消費されてしまい 本来やるべき本質的なことではないのに非常にもったいないですよね。そこで、なるべくシンプルかつ今まで触ったことがない技術を使って上記の課題を解決する仕組みを作れば、 みんな助かるし自分としてもアドベントカレンダーのネタができてみんなが幸せになっている未来しか見えない！ と思って購買申請フローを簡単にする仕組みを作ることにしました。作ったもの以下のような仕組みを作りました。Google フォームから購買申請を入力申請内容を GitHub issue として自動作成申請が登録・クローズされると処理担当者と申請者に slack で通知申請者、担当者それぞれが微妙に困っていたところを解決する仕組みになっています。仕組みの中身Simple & Easy 購買申請フロー は以下を使って実装されています。(くそダサいけどここではそう呼びます)GoogleフォームGapps ScriptFirebase (Cloud Functions)GitHub issuesSlackFirebase が中心となってそれぞれと連携しています。コード公開用にすこしいじったコードを GitHub　で公開しています。特に特殊なことはありませんが、似たような仕組みを作りたい方がいたら参考になれば嬉しいです。https://github.com/Chanmoro/easy-workflow今回 Firebase の cloud functions を初めて使いましたが、node.js で express を使って web アプリを作っているのと同じなので、コードで困ったところは特になかったです。ハマった点firebase から外部に通信できない無料登録をした直後の課金が発生しないプランだと firebase の Cloud Functions から外部に通信できない制限がかかっていました。クレジットカードの情報を登録して従量課金プランにするとこの制限が外れます。無料枠の範囲があり 12万リクエスト/月までは無料で使えるので今回の用途では無料枠の範囲でまかなえると思います。Gapps Script ではリクエストヘッダーにアクセスできない当初はなるべく簡単にしたかったので Gapps Script だけで作ろうとしており、GitHub の webhook を受け取るのも Gapps Script でやろうとしていました。セキュリティを強固にするために webhook で設定できる secret token を使った署名のチェックを実装しようとしたのですが、Gapps Script ではリクエストヘッダーにアクセスできないことが分かりこの対応はできませんでした。リクエストパラメータに認証トークン的なものをつけた URL を webhook に設定するなど、自前で簡易的に認証を入れるようにすれば Gapps Script だけでも実現できると思います。今回はアドベントカレンダー用のネタを確保するという目的も途中でプラスして、ついでに typescript にも入門したと思い firebase を使うことにしました。こういうのを動かすのは heroku とかでもいいんですが firebase の格安さは非常に魅力だと思います。初回のリクエストには起動に時間がかかるcloud functions はコールドスタートなので、デプロイの直後やしばらく時間が経つと処理に時間がかかります。恐らくコンテナが停止している場合の起動に時間がかかっていると思われます。今回のケースでは手を抜いて1つの function を通常の express アプリケーションのように実装してしまいましたが、なるべくURL単位でアプリケーションを細かく分けて起動にかかる処理をコンパクトにしておく方が良さそうです。最後にこの記事では、 既存の購買申請フローにあったちょっとした課題を便利な技術で解決しました 、ということを書きました。もちろんこれが完璧な仕組みではないことは重々承知していますが、こういうちょっとした工夫で日々ちょっとだけ困っていることを解決できるのはエンジニアとしてとても楽しいことですよねー。影響の小さいところでいろいろと試してみると、 エンジニアリングでの課題解決の楽しさも新しい技術の習得もどちらも得られて非常にお得 だと思うので、これからもちょこちょこやっていこうと思います！

Firebase で購買申請フローを作った話

PyCharm でファイル保存時に autopep8 で自動フォーマットしたい！と思ったのですが、ググってもなかなか情報が出てこず・・・苦戦しましたが解決したのでメモですPyCharm での設定ファイルウォッチャーという、ファイルが保存されたタイミングで任意のプログラムを実行できる機能を使って autopep8 が実行されるように設定しますhttps://pleiades.io/help/idea/using-file-watchers.html1. 新規のウォッチャーを追加設定画面から [Tools] → [File Watchers] を選択し + ボタンをクリックしますもしメニューに File Watchers が表示されていない場合は、同じ名前の File Watchers というプラグインをインストールすると表示されるようになります2. autopep8 を設定以下の画面が表示されたらそれぞれ項目を入力しますFile type Python を選択一つ下の Scope を選ぶと対象とするファイルのディレクトリを制限できますProgramautopep8 コマンドの場所を選択例) /hoge/bin/autopep8Argumentsautopep8 に渡す引数を入力例) --in-place --aggressive --aggressive $FilePath$(optional) 3. 全てのプロジェクトで有効にしたい場合デフォルトではファイルウォッチャーを追加したプロジェクトでのみ有効になっているので、以下のファイルウォッチャーの一覧画面で Level を Global に設定すると他プロジェクトでも利用できますファイルウォッチャーを作成したプロジェクト以外では、 Enabled がオフになってしまっているので忘れずにオンにしましょう(optional) 4. プロジェクト毎に別設定を利用したい場合例えば、プロジェクトのディレクトリ直下に .flake8 を置いていて、プロジェクト毎に異なる設定を有効にしたいとしますautopep8 の引数の --global-config にプロジェクト毎の設定ファイルのパスを渡すことで異なる設定を有効にできます例えば以下を Arguments に設定します--in-place --aggressive --aggressive $FilePath$ --global-config $ProjectFileDir$/.flake8ダメだった方法command + s をマクロで置き換える以下の Q&A で書かれているように、 autopep8 実行 と 保存 をするマクロを作り、 command + s にそのマクロをバインドする方法も試してみましたhttps://stackoverflow.com/questions/44483748/pycharm-pep8-on-saveですが、これだとファイルの拡張子に関係なく全てのファイルに autopep が適用されてしまい、 yml や json のファイルが勝手に書き換わってしまうという問題が起こることが分かり即却下となりました・・・Save Actions を使うSave Actions というプラグインを使うと保存時にフォーマットの修正を自動で実行できますただこれは、 PyCharm に設定したコードフォーマットを適用するというだけなので、 autopep8 を実行するためには使えませんでしたhttps://plugins.jetbrains.com/plugin/7642-save-actions

PyCharm でファイル保存時に autopep8 で自動フォーマットしたい！

リスト内包記法でズンドコしたい！最近お仕事で毎日 Python を書いているのですが、リスト内包記法に慣れてきたのでよく使ってますある日ふとズンドコキヨシのことを思い出し、リスト内包記法でズンドコを簡潔に書けたら嬉しいなと思いやってみましたもうだいぶ古くなってしまったネタですがよく知らない方はこちらをご参照くださいませズンドコキヨシまとめやりたいことズンドコキヨシの仕様を改めて確認すると、以下の動作を満たせばよいということですズン or ドコ をランダムに出力する直近5回の出力が 'ズン', 'ズン', 'ズン', 'ズン', 'ドコ' の場合に キ・ヨ・シ！ を返して処理を終了するこれをリスト内包記法でいい感じにズンドコできないかなーとイメージとしては以下のようなコードでズンドコが定義できたらなーと夢を持ちました[x for x in zundoko()]そして上記のコードが評価されるとこのようなリストが生成されて欲しいです['ズン', 'ドコ', 'ズン', 'ズン', 'ズン', 'ズン', 'ズン', 'ドコ', 'キ・ヨ・シ！']Level1. ジェネレーターでズンドコどうやらジェネレーターを上手く使えばできそうだということがわかったので、これまでジェネレーターについてあまり詳しく知らなかったのですが調べながらやってみましたまずできたのが以下のようなコードですimport randomdef zundoko():    history = []    while True:        history.append(random.choice(['ズン', 'ドコ']))        yield history[-1]        if history[-5:] == ['ズン', 'ズン', 'ズン', 'ズン', 'ドコ']:            yield 'キ・ヨ・シ！'            breakprint([x for x in zundoko()])非常に基本的なジェネレーターですLevel2. ジェネレーター内で再帰するLevel1 のものだと while True が入るところがちょっと引っかかり再帰にしたいなーと思いましたそして考えたのが以下のコードですimport randomdef zundoko(history=None):    if history is None:        history = []    if history[-5:] == ['ズン', 'ズン', 'ズン', 'ズン', 'ドコ']:        yield 'キ・ヨ・シ！'        return    history.append(random.choice(['ズン', 'ドコ']))    yield history[-1]    yield from zundoko(history)print([x for x in zundoko()])Level3. 生成と判定を別にするLevel2 のものは値の生成とズンドコ判定が同じジェネレーターの中にあるので、そこを切り離したいなーと思いましたそして考えたのが以下のコードですimport randomdef zundoko_gen():    yield random.choice(['ズン', 'ドコ'])    yield from zundoko_gen()def zundoko():    history = []    for x in zundoko_gen():        history.append(x)        yield history[-1]        if history[-5:] == ['ズン', 'ズン', 'ズン', 'ズン', 'ドコ']:            yield 'キ・ヨ・シ！'            breakprint([x for x in zundoko()])Level4. 更に過去の window を生成する処理を別にする(※更によい新たなパターンをコメントを頂き追記しました！)Level3 では過去に生成されたズンドコを保持する処理も混ざってしまっているところが気持ち悪かったのですが、指定した個数分の window を生成するジェネレーターを間に挟むことで、より各々のジェネレータの役割が明確になりシンプルな構成にすることができましたimport randomdef zundoko_stream():    """    無限に 'ズン' or 'ドコ' を生成する    """    yield random.choice(['ズン', 'ドコ'])    yield from zundoko_stream()def zundoko_window(length):    """    生成されたズンドコの直近 length 個分の window を生成する    """    history = []    for zundoko_val in zundoko_stream():        history += [zundoko_val]        history = history[-length:]        yield historydef zundoko(pattern=['ズン'] * 4 + ['ドコ']):    for window in zundoko_window(len(pattern)):        yield window[-1]        if window == pattern:            yield 'キ・ヨ・シ！'            breakprint([x for x in zundoko()])ズンドコを無限に生成するストリーム -> 任意の数だけ切り取る window -> window に対するパターンマッチ というより汎用的なズンドコストリーム処理になりましたね！まとめリスト内包記法でズンドコというより、ジェネレーターでズンドコになってしまいましたジェネレーターは奥が深いですねなんかもっとスッキリできそうな感じがしますが、現状の僕の理解度だとこの程度です使いこなすにはまだまだ修行が必要だと感じましたみんなもジェネレーターでリスト内包記法しよう！

Python のリスト内包記法でズンドコしてみよう！

Scrapy とはScrapy とは Python でクローラーを実装するためのフレームワークですPython でクローラーというと BeautifulSoup や lxml などの HTML パーサーがよく使われていますが、 Scrapy はこれらのライブラリと違うレイヤーのもので、クローラーのアプリケーション全体を実装するためのフレームワークです公式ドキュメントでも、BeautifulSoup と Scrapy を比較するのは、jinja2 と Django を比較しているようなものだと言ってますIn other words, comparing BeautifulSoup (or lxml) to Scrapy is like comparing jinja2 to Django.TL;DRScrapy はクローラーを実装・運用するために欲しい機能がいろいろ用意されているItems は抽出したいデータ構造のモデルSpider は対象サイトへのリクエストとレスポンスのパーサーPipeline は抽出したデータに対する加工・保存 (など)登場人物を整理とりあえずこの3つを理解しておけばクローラーは書けますSpiderクロール対象のサイトへのリクエスト、レスポンスのパース処理を記述しますどのようにサイトを辿って、ページの内容をどうパースするかのロジックが Spider に書かれますItemsクロール対象のデータから抽出したいデータ構造を記述するモデルのようなものです目的に応じて自由な構造を定義できますItems は Spider で生成され Pipeline に渡されますPipelineSpider より渡された Items に対する処理を記述しますDB への保存、ファイル出力など目的に応じて自由に処理を記述できますインストール以下のように pip でインストールするのみです$ pip install scrapyインストールが完了すると scrapy コマンドが使えるようになります$ scrapy versionScrapy 1.5.1Scrapy を利用してクローラーを作る0.プロジェクトを作成するscrapy startproject <プロジェクト名> のコマンドで新規の scrapy プロジェクトを作成しますこの辺りの設計は Django ととても似ています$ scrapy startproject ten_min_scrapy以下のようなファイルが生成されます$ tree ten_min_scrapy/ten_min_scrapy/├── scrapy.cfg└── ten_min_scrapy    ├── __init__.py    ├── __pycache__    ├── items.py    ├── middlewares.py    ├── pipelines.py    ├── settings.py    └── spiders        ├── __init__.py        └── __pycache__4 directories, 7 files1.Spider を実装するそれでは scrapinghub のブログである https://blog.scrapinghub.com/ をクロールしてブログ記事の一覧を取得してくる Spider を実装してみましょう1-1. Items を追加するプロジェクトを作成すると items.py にサンプルのクラスが記述されていますimport scrapyclass TenMinScrapyItem(scrapy.Item):    # define the fields for your item here like:    # name = scrapy.Field()    passこのクラス名は適当に変えてしまってよいので、ブログ記事のURL、タイトル、公開日をもつ Post を Items として定義しましょうimport scrapyclass Post(scrapy.Item):    url = scrapy.Field()    title = scrapy.Field()    date = scrapy.Field()1-2. Spider を追加する新規の Spider は以下のようにプロジェクトのディレクトリ内で scrapy genspider <スパイダー名> <クロール対象ドメイン名> コマンドを実行するとひな型のファイルが生成されます$ cd ./ten_min_scrapy$ scrapy genspider scrapy_blog_spider blog.scrapinghub.comひな型のファイルは以下のような内容になっていますこのコマンドを使わずに直接該当のファイルを作成しても問題ないですimport scrapyclass ScrapyBlogSpiderSpider(scrapy.Spider):    name = 'scrapy_blog_spider'    allowed_domains = ['blog.scrapinghub.com']    start_urls = ['http://blog.scrapinghub.com/']    def parse(self, response):        passstart_urls に指定したURLからクロールがスタートしますレスポンスを受け取ると parse() メソッドが呼び出されます1-3. Spider 内の parse() を追加するblog.scrapinghub.com のページをブラウザから見ると、以下のようにページを辿っていけばブログ記事の一覧を抽出できそうだとわかりますブログの一覧から記事のURL、タイトル、公開日を抽出するページ内に "OLDER POST" のリンクがあれば再帰的に辿り 1 の処理を繰り返すページ内に "OLDER POST" のリンクが表示されなければ処理を終了これを parse() 内に実装すると以下のようになりますimport scrapyfrom ten_min_scrapy.items import Postclass ScrapyBlogSpiderSpider(scrapy.Spider):    name = 'scrapy_blog_spider'    allowed_domains = ['blog.scrapinghub.com']    start_urls = ['http://blog.scrapinghub.com']    def parse(self, response):        """        レスポンスに対するパース処理        """        # response.css で scrapy デフォルトの css セレクタを利用できる        for post in response.css('.post-listing .post-item'):            # items に定義した Post のオブジェクトを生成して次の処理へ渡す            yield Post(                url=post.css('div.post-header a::attr(href)').extract_first().strip(),                title=post.css('div.post-header a::text').extract_first().strip(),                date=post.css('div.post-header span.date a::text').extract_first().strip(),            )        # 再帰的にページングを辿るための処理        older_post_link = response.css('.blog-pagination a.next-posts-link::attr(href)').extract_first()        if older_post_link is None:            # リンクが取得できなかった場合は最後のページなので処理を終了            return        # URLが相対パスだった場合に絶対パスに変換する        older_post_link = response.urljoin(older_post_link)        # 次のページをのリクエストを実行する        yield scrapy.Request(older_post_link, callback=self.parse)response.css() で scrapy のデフォルトで用意されている CSSセレクタを利用できますHTMLのパースは基本的にはこれをそのまま使えば困ることはないでしょう1-4. クロールの設定を変更するリクエスト間隔を設定するsettings.py を開いて DOWNLOAD_DELAY にリクエストを送信する間隔(秒)をセットしましょうデフォルトではコメントアウトされていますリクエスト間隔が短すぎると DoS攻撃と同等のアクセスとなってしまうので、少なくとも数秒程度は間隔を空けるようにしましょう# Configure a delay for requests for the same website (default: 0)# See https://doc.scrapy.org/en/latest/topics/settings.html#download-delay# See also autothrottle settings and docsDOWNLOAD_DELAY = 3レスポンスのキャッシュを設定するScrapy ではレスポンスのキャッシュ機能も用意されていますSpider の実装をして試行錯誤する時には何度も同じページへのリクエストが実行されてしまうので、特に開発中にはキャッシュを有効にした方がいいですsettings.py を開いて HTTPCACHE_ から始まる以下の項目のコメントを外せばキャッシュが有効になります# Enable and configure HTTP caching (disabled by default)# See https://doc.scrapy.org/en/latest/topics/downloader-middleware.html#httpcache-middleware-settingsHTTPCACHE_ENABLED = TrueHTTPCACHE_EXPIRATION_SECS = 0HTTPCACHE_DIR = 'httpcache'HTTPCACHE_IGNORE_HTTP_CODES = []HTTPCACHE_STORAGE = 'scrapy.extensions.httpcache.FilesystemCacheStorage'1-5. 一度動かしてみるさて、ここまでで実装した Spider を一度実行してみましょうプロジェクトのディレクトリで以下を実行すると Spider が実行できます$ scrapy crawl scrapy_blog_spider以下のように DEBUGログが出力されていることを確認しましょう抽出した Item の内容が出力されていますねブログ記事のタイトル、URL、公開日が正しく取得できていることがわかります2018-10-08 12:53:46 [scrapy.core.engine] DEBUG: Crawled (200) <GET https://blog.scrapinghub.com> (referer: None) ['cached']2018-10-08 12:53:46 [scrapy.core.scraper] DEBUG: Scraped from <200 https://blog.scrapinghub.com>{'date': 'September 27, 2018', 'title': 'Data Quality Assurance for Enterprise Web Scraping', 'url': 'https://blog.scrapinghub.com/data-quality-assurance-for-enterprise-web-scraping'}2018-10-08 12:53:46 [scrapy.core.scraper] DEBUG: Scraped from <200 https://blog.scrapinghub.com>{'date': 'September 12, 2018', 'title': 'What I Learned as a Google Summer of Code student at Scrapinghub', 'url': 'https://blog.scrapinghub.com/what-i-learned-as-a-google-summer-of-code-student-at-scrapinghub'}2018-10-08 12:53:46 [scrapy.core.scraper] DEBUG: Scraped from <200 https://blog.scrapinghub.com>{'date': 'July 25, 2018', 'title': 'GDPR Compliance For Web Scrapers: The Step-By-Step Guide', 'url': 'https://blog.scrapinghub.com/web-scraping-gdpr-compliance-guide'}...item をファイルに出力する以下のように -o オプションをつけると、抽出した item をファイルに出力できますこれは csv ファイルに出力する例です$ scrapy crawl scrapy_blog_spider -o data.csvcsv の他にもデフォルトで json, json lines, xml に対応しています詳しくは以下を見てみましょうhttps://doc.scrapy.org/en/latest/topics/feed-exports.html#topics-feed-exports2. Pipeline を実装するさて、 Spider の実装ができたので次に Pipeline を実装して、 SQLite のデータベースにデータを保存してみましょうプロジェクトを作成した最初の状態では pipelines.py の内容は以下のようにひな型が作成されていますclass TenMinScrapyPipeline(object):    def process_item(self, item, spider):        return itemspider から items が yield されたタイミングで process_item() が呼び出されますここでデータベースに登録する処理します2-1. process_item() を実装する詳細の説明は省きますがこんな感じで実装しましたimport datetimeimport osimport sqlite3class TenMinScrapyPipeline(object):    _db = None    @classmethod    def get_database(cls):        cls._db = sqlite3.connect(            os.path.join(os.getcwd(), 'ten_min_scrapy.db'))        # テーブル作成        cursor = cls._db.cursor()        cursor.execute(            'CREATE TABLE IF NOT EXISTS post(\                id INTEGER PRIMARY KEY AUTOINCREMENT, \                url TEXT UNIQUE NOT NULL, \                title TEXT NOT NULL, \                date DATE NOT NULL \            );')        return cls._db    def process_item(self, item, spider):        """        Pipeline にデータが渡される時に実行される        item に spider から渡された item がセットされる        """        self.save_post(item)        return item    def save_post(self, item):        """        item を DB に保存する        """        if self.find_post(item['url']):            # 既に同じURLのデータが存在する場合はスキップ            return        db = self.get_database()        db.execute(            'INSERT INTO post (title, url, date) VALUES (?, ?, ?)', (                item['title'],                item['url'],                datetime.datetime.strptime(item['date'], '%B %d, %Y')            )        )        db.commit()    def find_post(self, url):        db = self.get_database()        cursor = db.execute(            'SELECT * FROM post WHERE url=?',            (url,)        )        return cursor.fetchone()Pipeline を有効にするPipeline の処理を有効にするために setting.py の内容を変更しますITEM_PIPELINES の箇所のコメントを外せばOKです# Configure item pipelines# See https://doc.scrapy.org/en/latest/topics/item-pipeline.htmlITEM_PIPELINES = {    'ten_min_scrapy.pipelines.TenMinScrapyPipeline': 300,}今回は scrapy がデフォルトで生成してくれた TenMinScrapyPipeline をセットしていますが、自分で追加した任意のクラスも同じように dict のキーとして指定すると Pipeline として認識されますまた、値にセットされている数値は処理の優先順で、数値の小さい順に処理が適用されていきますPipeline は今回紹介したDBに登録する処理以外にもデータのバリデーションや加工などの処理のために使うことができます2-2. 実行してみるそれでは最後に Spider を実装してみましょう$ scrapy crawl scrapy_blog_spider実行が完了するとカレントディレクトリに ten_min_scrapy.db という SQLite のファイルが作成されていると思いますここにクロールしたデータが格納されています$ sqlite3 ten_min_scrapy.db SQLite version 3.19.3 2017-06-27 16:48:08Enter ".help" for usage hints.sqlite> select * from post order by date desc limit 10;1|https://blog.scrapinghub.com/data-quality-assurance-for-enterprise-web-scraping|Data Quality Assurance for Enterprise Web Scraping|2018-09-27 00:00:002|https://blog.scrapinghub.com/what-i-learned-as-a-google-summer-of-code-student-at-scrapinghub|What I Learned as a Google Summer of Code student at Scrapinghub|2018-09-12 00:00:003|https://blog.scrapinghub.com/web-scraping-gdpr-compliance-guide|GDPR Compliance For Web Scrapers: The Step-By-Step Guide|2018-07-25 00:00:004|https://blog.scrapinghub.com/web-scraping-at-scale-lessons-learned-scraping-100-billion-products-pages|For E-Commerce Data Scientists: Lessons Learned Scraping 100 Billion Products Pages|2018-07-02 00:00:005|https://blog.scrapinghub.com/2018/06/19/a-sneak-peek-inside-what-hedge-funds-think-of-alternative-financial-data|A Sneak Peek Inside What Hedge Funds Think of Alternative Financial Data|2018-06-19 00:00:006|https://blog.scrapinghub.com/2018/06/07/fitbit-quarterly-revenue-web-scraped-product-data|Want to Predict Fitbit’s Quarterly Revenue? Eagle Alpha Did It Using Web Scraped Product Data|2018-06-07 00:00:007|https://blog.scrapinghub.com/2018/05/30/gdpr-compliance-tools-web-scraping-crawlers|How Data Compliance Companies Are Turning To Web Crawlers To Take Advantage of the GDPR Business Opportunity|2018-05-30 00:00:008|https://blog.scrapinghub.com/2017/12/31/looking-back-at-2017|Looking Back at 2017|2017-12-31 00:00:009|https://blog.scrapinghub.com/2017/11/05/a-faster-updated-scrapinghub|A Faster, Updated Scrapinghub|2017-11-05 00:00:0010|https://blog.scrapinghub.com/2017/07/07/scraping-the-steam-game-store-with-scrapy|Scraping the Steam Game Store with Scrapy|2017-07-07 00:00:00これで Scrapy を使ったクローラーの基本がわかりましたね！TipsScrapy を使ってクローラーを実装する上での簡単な Tips を紹介しますクロールを開始する URL を動的に変えたい先ほどの例のように start_urls で固定の URL を指定するだけだと実際の利用シーンではかなり不便そうですよねそういう場合は以下のように Spider の start_requests() メソッドを実装すれば動的にURLをセットできますこの start_requests() は Spider の処理を開始する際に呼び出されます    def start_requests(self):        url = 'https://sardine-system.com/media/'        yield scrapy.Request(url, callback=self.parse)また、 scrapy.Request(url, callback=self.parse) で指定している callback はレスポンスを受け取った後にコールバックされる処理ですstart_requests() を使わない場合は先ほど記載した通り parse() が実行されますが、ここを任意の関数に変更することができますparse の処理を別モジュールに切り出したい時に便利ですねSpider に引数で値を渡したいSpider の外部からクロール先のURLやパラメーターを渡したい時もあると思いますが、Spider の起動時に -a key=value の形式で Spider に引数を渡すことができます$ scrapy crawl scrapy_blog_spider -a param1=val1ここで指定された値は Spider のコンストラクタの引数に渡されますSpider の __init__() の引数に渡したい引数名を入れておけば対応するものにセットされますまた、__init__() の引数に明示されていないものは kwargs にセットされます    def __init__(self, param1=None, *args, **kwargs):        super(ScrapyBlogSpiderSpider, self).__init__(*args, **kwargs)        # 引数に明示していない場合は kwargs から取得できる        arguments_from_outside = kwargs.get('param2', 0)BeautifulSoup や他の HTMLパーサーを使いたい場合BeautifulSoup の方がいい！という方でも大丈夫 response.text にレスポンスボディがセットされているので、BeautifulSoup やその他の HTMLパーサーも以下のようにして自由に利用できますdef parse(self, response):    # use lxml to get decent HTML parsing speed    soup = BeautifulSoup(response.text, 'lxml')    yield {        "url": response.url,        "title": soup.h1.string    }まとめさて、今回は Scrapy を利用したクローラーの作り方について書きましたちゃんとクローラーを作ろうとするとHTMLのパースの処理以外にも、以下のような様々な周辺の処理が必要になってくるはずですデータの加工・保存エラー発生時の処理リクエストの間隔制御Scrapy はそういったクローラーの汎用的なアーキテクチャーと実装を提供してくれているので、定期的に実行されるクローラを作るにはとても便利なフレームワークです今回実装したソースコード今回実装したソースコードの一式はこちらに置いています※Beautiful Soup と Scrapy の組み合わせ方についても書いたのでぜひ読んでみてください！10分で理解する Beautiful Soup

10分で理解する Scrapy

SpriteKit とはApple が提供している2Dのゲームを作るためのフレームワークですアニメーションや物理シミュレーションを使ったゲームが簡単に実装できますこの他にも本格的なゲーム開発では以下のようなフレームワークが使われるようですCocos2d-xUnityUnreal EngineSpriteKit は学習コストが低くとりあえずシンプルなゲームを作るには十分な機能を備えていますTL;DR画面に遷移した時は didMove 、タップした時は touchDown が呼び出される.sks ファイルは .storyboard みたいなもの表示要素は ノード と呼ばれる物理演算は SKPhysicsBody 、アニメーションなどの動きは SKAction がいい感じに処理してくれるSpriteKit を利用したゲームの作り方Xcode のプロジェクトを作るXcode で新規プロジェクトを作成する時に "Game" を選択します"Game Technology" に "SpriteKit" を選択します※デフォルトで SpriteKit が選択されていますこれでベースが作成されますとりあえず実行してみるプロジェクトを新規作成した状態から何も変えずにとりあえず実行してみましょうめちゃくちゃシンプルなサンプルコード的なものが自動で作成されているので、以下のようなアプリが起動するはずです画面をタップすると Hello, World! の文字が小さくなって、タップした位置に四角が表示されます画面に触れたまま動かすと四角が追従して動くというものですソースコードを見てみる画面をタップした時にどんな処理が実行されているかを見て見ましょう先ほどのアニメーションの処理は GameScene.swift の中に書かれていますまず、画面をタップした時には touchesBegan が呼び出されますこれは SpriteKit のルールですGameScene.swift    override func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent?) {        if let label = self.label {            label.run(SKAction.init(named: "Pulse")!, withKey: "fadeInOut")        }        for t in touches { self.touchDown(atPoint: t.location(in: self)) }    }この中で label.run(SKAction.init(ほげほげ) 書かれている処理で、Hello, World! の文字が小さくなるアニメーションが実行されています追従する四角を表示する処理はパッと見ここには無さそうなので self.touchDown(ほげほげ) の中身を見てみましょうtouchDown は同じファイルに書かれていますGameScene.swift    func touchDown(atPoint pos : CGPoint) {        if let n = self.spinnyNode?.copy() as! SKShapeNode? {            n.position = pos            n.strokeColor = SKColor.green            self.addChild(n)        }    }self.spinnyNode というオブジェクトをコピーして、位置と色を設定して自分の画面に追加する処理をしていますここで、self.spinnyNode が何者かは同じファイルの以下の部分に書かれていますGameScene.swift    override func didMove(to view: SKView) {        // Get label node from scene and store it for use later        self.label = self.childNode(withName: "//helloLabel") as? SKLabelNode        if let label = self.label {            label.alpha = 0.0            label.run(SKAction.fadeIn(withDuration: 2.0))        }        // Create shape node to use during mouse interaction        let w = (self.size.width + self.size.height) * 0.05        self.spinnyNode = SKShapeNode.init(rectOf: CGSize.init(width: w, height: w), cornerRadius: w * 0.3)        if let spinnyNode = self.spinnyNode {            spinnyNode.lineWidth = 2.5            spinnyNode.run(SKAction.repeatForever(SKAction.rotate(byAngle: CGFloat(Double.pi), duration: 1)))            spinnyNode.run(SKAction.sequence([SKAction.wait(forDuration: 0.5),                                              SKAction.fadeOut(withDuration: 0.5),                                              SKAction.removeFromParent()]))        }    }didMove はこの画面が呼び出された時に実行される処理ですこれも SpriteKit のルールですこの中で self.spinnyNode は角が丸い四角の形に設定された SKShapeNode のオブジェクトがセットされていて、更にずっとクルクル回って1秒くらいしたら消えるアニメーションが定義されていますこのアニメーションは self.addChild(ほげ) した時に画面に描画されます.sks ファイルlabel は Hello, World! の文字を表示するオブジェクトで、GameScene.sks を開くと定義されています.sks ファイルは storyboard と同じようなもので、画面のレイアウトをコードではなく視覚的に定義するためのファイルですstoryboard と同様に、これを使っても画面を作れますし使わなくてもコードから指定することで画面のレイアウトを作れます全てのパーツはノードHello, World! のラベルは SKLabelNode クラスのオブジェクト、タップした時に表示される四角は SKShapeNode クラスのオブジェクトです画面に表示されるパーツは全て SKNode の子クラスとなります画像を表示したい時は SKSpriteNode を使う別途デザインした画像をノードに表示したい場合は SKSpriteNode クラスを利用しますオブジェクト生成時の引数に、Assets に登録されている画像ファイル名を指定するとその画像が表示されますlet spaceship = SKSpriteNode(imageNamed: "rocket.png")spaceship.position = CGPoint(x: 100, y: 100)self.addChild(spaceship)※コードは公式ドキュメントより引用https://developer.apple.com/documentation/spritekit/skspritenode物理演算は SKPhysicsBodyノードに落下とかボールのバウンドのような物理シミュレーションを適用したい場合は、対象ノードのプロパティ physicsBody に SKPhysicsBody をセットすると物理演算を裏で勝手にやってくれますlet texturedSpaceShip = SKSpriteNode(texture: spaceShipTexture)texturedSpaceShip.physicsBody = SKPhysicsBody(texture: spaceShipTexture,                                              size: CGSize(width: circularSpaceShip.size.width,                                                           height: circularSpaceShip.size.height))※コードは公式ドキュメントより引用https://developer.apple.com/documentation/spritekit/skphysicsbodyノードを動かしたい時は SKActionSKAction というのがとても万能で、ノードを動かしたり、アニメーションを実行したり、音を鳴らしたり、それらのアクションを順番に実行したりと様々なことをやってくれますまとめサンプルコードの処理を元にどんな登場人物がいるのかをめちゃくちゃざっくり見ていきました登場するクラスの数も多くないので、とりあえずゲームを作ってみるには SpriteKit はピッタリだと思います公式ドキュメントにはより詳細な説明と分かりやすいサンプルコードが載っているので、開発する際にはこちらを見てみましょうhttps://developer.apple.com/documentation/spritekit

10分で理解するSpriteKit

Terraform とはインフラストラクチャ定義ツール に分類されるツールで、クラウド上のリソースを定義ファイルの状態になるように生成・操作してくれますインフラの構成を宣言的に定義できるところが特徴で、構築手順を書くのと違って構成定義のみに集中することができます※宣言的に定義できる とは「t2.micro インスタンスを1つ」と書くだけで、作成手順を意識しなくてもその通りに出来上がるということです単純にスクリプト化するだけだと、手続き的に構築手順を書く必要がありますVagrant を開発している HashiCorp社 が開発しているツールなので使用感は Vagrant と同じような感じですTL;DR.tf ファイルに定義内容を記述し、$ terraform apply を実行するだけで定義内容の通りに自動でインフラを構築してくれますインストール以下に従って OS 毎のビルド済みバイナリをダウンロードしてきてパスを通すだけhttps://www.terraform.io/intro/getting-started/install.htmlMac の場合Homebrew でインストールできますHomebrewでインストール$ brew update$ brew install terraformAWS での使い方事前準備IAM ユーザーを作るaws cli を利用するための アクセスキーを取得します管理者に依頼して IAM ユーザーを作成してもらってくださいhttps://console.aws.amazon.com/iam/home?#/home利用したい AWS サービス(EC2、S3とか)に対しての操作権限をつけてもらう必要がありますAWS CLI をセットアップする以下を参考に aws コマンドを使えるように設定するhttp://docs.aws.amazon.com/ja_jp/streams/latest/dev/kinesis-tutorial-cli-installation.html$ aws configure で認証情報をセットした後であれば自動でこのAWS認証情報を参照してくれます※~/.aws/credentials にAWSの認証情報が保存されますEC2インスタンスを作成する1. .tf ファイルを作成するAWS の認証情報をセットするvariables.tf ファイルを作成し、操作したいリージョン を以下のように記述しますvariables.tfprovider "aws" {  version = "~> 2.0"  region  = "ap-northeast-1"}EC2 のスペックを定義するec2.tfresource "aws_instance" "sandbox" {  count         = 2  ami           = "ami-785c491f" # Ubuntu 16.04 LTS official ami  instance_type = "t2.micro"  tags = {    Name = "${format("sandbox-%02d", count.index + 1)}"  }}※ terraform v0.11 までは tags に = は不要でしたが、v0.12 より一部の構文が変更となり tags = と書くようになりました(参考) https://www.terraform.io/upgrade-guides/0-12.html#attributes-vs-blocks 上記は以下を表してます2つインスタンスを生成AMI: ami-785c491f (Ubuntu 16.04 LST)t2.microName に "sandbox-xx"2. 定義内容をチェックする1 . variable.tf と ec2.tf が置かれているディレクトリ内で以下を実行初めて実行する場合のみ初期化のために init を実行しますinit$ terraform init定義内容のチェックは plan を実行しますplan$ terraform plan2 . 実行されるプランの内容が出力される定義内容が意図した通りに反映されるかを確認します出力結果〜+ aws_instance.sandbox.0    ami:                          "ami-785c491f"〜    tags.Name:                    "sandbox-01"〜+ aws_instance.sandbox.1    ami:                          "ami-785c491f"〜    tags.Name:                    "sandbox-02"〜Plan: 2 to add, 0 to change, 0 to destroy.3. 定義を適用してインスタンスを作成する1 .  同ディレクトリ内で以下を実行apply$ terraform apply2 . 出力を確認ずらーーーーーっと出るので、2オブジェクトが add されたことを確認出力結果〜Apply complete! Resources: 2 added, 0 changed, 0 destroyed.〜3 . terraform show を見てみるterraform が作成したオブジェクトの内容が出力されます出力結果$ terraform showaws_instance.sandbox.0:  id = i-02bbfece7cbf56027〜aws_instance.sandbox.1:  id = i-0aad82a9b81951965〜4 . EC2 コンソールを確認sandbox-01 sandbox-02 の 2つのインスタンスが作成されていることが確認できます4. 定義内容を変更する今あるインスタンスの設定値を変更する1 . インスタンスの名称を modified sandbox-xx に変更するec2.tf〜     Name = "${format("modified sandbox-%02d", count.index + 1)}"〜2 . 変更内容をチェックplan$ terraform plan〜~ aws_instance.sandbox.0    tags.Name: "sandbox-01" => "modified sandbox-01"〜tag の差分が表示されていることがわかります3 . 変更を適用apply$ terraform apply〜Apply complete! Resources: 0 added, 2 changed, 0 destroyed.〜4 . terraform show で確認show$ terraform showaws_instance.sandbox.0:〜  tags.Name = modified sandbox-01〜aws_instance.sandbox.1:〜  tags.Name = modified sandbox-02〜tag の変更が反映されてます5 . ec2 コンソールを確認コンソールからも変更が確認できますインスタンスの数を変更する1 . count を 1 に変更するec2.tf〜  count         = 1〜2 . 変更内容をチェックplan$ terraform plan〜- aws_instance.sandbox.1Plan: 0 to add, 0 to change, 1 to destroy.sandbox.1 が削除されるということがわかります3 . 変更を適用apply$ terraform apply〜Apply complete! Resources: 0 added, 0 changed, 1 destroyed.sandbox.1 が削除されたログが出力されています4 . ec2 コンソールを確認modified sandbox-02 が削除されたことがわかります5. terraform で定義したリソースを全て削除する1 . terraform destroy 確認を促すプロンプトが出るので "yes" を入力すると削除が開始されますdestroy$ terraform destroyDo you really want to destroy?  Terraform will delete all your managed infrastructure.  There is no undo. Only 'yes' will be accepted to confirm.  Enter a value: yesaws_instance.sandbox: Refreshing state... (ID: i-02bbfece7cbf56027)aws_instance.sandbox: Destroying... (ID: i-02bbfece7cbf56027)aws_instance.sandbox: Still destroying... (ID: i-02bbfece7cbf56027, 10s elapsed)aws_instance.sandbox: Still destroying... (ID: i-02bbfece7cbf56027, 20s elapsed)aws_instance.sandbox: Still destroying... (ID: i-02bbfece7cbf56027, 30s elapsed)aws_instance.sandbox: Still destroying... (ID: i-02bbfece7cbf56027, 40s elapsed)aws_instance.sandbox: Still destroying... (ID: i-02bbfece7cbf56027, 50s elapsed)aws_instance.sandbox: Destruction completeDestroy complete! Resources: 1 destroyed.2 . terraform show で確認show$ terraform show管理下のオブジェクトが何もないことが確認できます3 . ec2 コンソールで確認全て削除されていることがわかります

10分で理解するTerraform

Grafana とはGrafana は Grafana Labs が公開しているログ・データ可視化のためのツールです可視化ツールとしては kibana とほぼ同じようなものですGrafana も kibana も、DB に保存されたログに対してリアルタイムにクエリを投げてデータを表示することができ、表示する期間の長さや時間帯を変えたり、パーツ毎に特定のノードだけのデータを表示したりインタラクティブに可視化を操作することができますGrafana は複数のデータベースに対応しており現時点では以下に対応しています- Graphite- Prometheus- Elasticsearch- InfluxDB- OpenTSDB- MySQL- AWS Cloudwatchkibana は elasticsearch のみ対応していますUI の機能は kibana の方が高機能な気がしますが、Grafana でもプラグインで様々な機能・UIが公開されていますし自分で開発することもできますhttps://grafana.com/pluginsただ、リソース監視やアプリケーションのスタッツ監視という観点で考えれば、そこまでリッチな可視化は必要ない場合がほとんどだと思うので、どちらを使っても大きな違いはないはずですPrometheus で取得したデータをカッコよく可視化するためにも Grafana を使うことができますGrafana インストール公式ドキュメント に沿ってインストールしてもらえばOKですが、Docker を利用するのが一番簡単ですデータの保存を考えずにとりあえず動かすならこれだけ！DockerでGrafanaを起動$ docker run -d -p 3000:3000 grafana/grafanaGrafana で可視化するDashboard というのを作成し Dashboard ごとに可視化パーツを設定していくことになります可視化の手順は基本的に以下だけです1. Dashboard を作成1. UIパーツを追加1. データ取得のクエリをセットクエリを考えるのに多少頭を使う必要があるくらいで、あとはサクサク試しながら追加していくことができます一度セットアップした Dashboard は保存できますし、設定を Json 形式で export できるのでコードとしてバックアップを取っておくことも可能です利用できる UIパーツデフォルトでは以下のパーツが用意されていますGraph と Singlestat があればとりあえず困ることはないでしょうHeatmap ってやつがなかなかイケてる見た目をしていますGrafana のプラグインでいろいろな UI パーツが公開されているので、込み入った表示がしたければそういうものを利用するのもありですgithub のコミットの履歴のグラフみたいなプラグインとかもありましたhttps://github.com/NeoCat/grafana-cal-heatmap-panelクエリの設定 (Prometheus の場合)利用するバックエンドによってクエリの詳細は違いますが、Prometheus を利用した場合の例を少しだけ10分で理解する Prometheus  で紹介した node_exporter を利用するとマシンのCPU、メモリ、ディスクなどのリソース情報を取得できます空きメモリを取得するには以下をセットします空きメモリ取得node_memory_MemAvailable各マシンの CPU 使用率は以下のクエリで取得できますCPU使用状況100 - (avg by (instance) (irate(node_cpu{mode="idle"}[5m])) * 100)ぶっちゃけクエリの意味はあんまりわかっていませんクエリの意味の解説はコチラへ！https://www.robustperception.io/understanding-machine-cpu-usage/これが Grafana で作ったダッシュボードだ！色々と設定をするとこんな感じのダッシュボードが出来上がりますPrometheus で用意されているデフォルトのダッシュボードと比べると雲泥の差ですね以上、快適なダッシュボードライフを！

10分で理解するGrafana

Prometheus とはSoundCloud が中心になって開発しているプル型のリソース監視ソフトウェアですアーキテクチャを見ると複雑そうに見えますが、Prometheus はセットアップがめちゃくちゃ簡単です全体を理解するPrometheus でできること監視の機能としてはあんまり目新しいものはないですが、監視対象が動的に変更されるようなスケーラブルな環境のリソース監視を意識した設計になっています監視対象のサーバーから情報を取得 & 保管保管済みデータに対して集計クエリを発行できるしきい値を超えた場合のアラート (メール、Slack、がんばればTwilioで電話)柔軟なアラート設定 (同じエラーはまとめて通知とかの設定ができる)登場人物Prometheus で監視の仕組みを入れるためには、以下の2つだけ知っていればとりあえず使えます名称説明exporter監視対象サーバー上で動かすプログラムテキスト形式でリソース情報を公開するWeb API のようなもの監視対象のリソース毎に exporter が用意されているprometheus監視サーバーのプログラム  定期的に全ての exporter をポーリングしてリソース情報を収集する 監視したデータは prometheus 内の DB に保持されるそれぞれ Docker イメージが提供されているので、以下の手順だけで特に複雑な設定は不要で動きます- 監視したいサーバーで exporter の Docker コンテナを動かす- 監視データ保管用のサーバーで Prometheus の Docker コンテナを動かすexporter の種類監視対象のサーバー上では、監視したいリソースの種類ごとに exporter を動かすことになります各ミドルウェアのベンダーごとに exporter を公開してくれていてたくさん種類がありますhttps://prometheus.io/docs/instrumenting/exporters/ちなみに過去にGPUマシンのリソース監視を入れた時には以下の2つの exporter を各GPUマシン上で動かしてます名称説明node_exporterCPU、メモリなど物理マシンの情報を取得するための exporterhttps://github.com/prometheus/node_exporternvidia_exporterGPUの利用使用状況を取得するための exporter https://github.com/Nextremer/nvidia_exporter  nvidia-smi で表示されるデータを取得できる tankbusta/nvidia_exporter をフォークして GPU のデバイスIDも取得できるように改良exporter から取得されるデータ例えば node_exporter が公開しているデータに直接 curl でアクセスしてみると、こんなデータが返ってきますアクセス時点のリソースの測定値をテキスト形式で返却されているだけですPrometheus サーバーは定期的にこのデータを収集しDBにこの値を格納していきますnode_exporter$ curl http://hogehoge:9100/metrics# HELP go_gc_duration_seconds A summary of the GC invocation durations.# TYPE go_gc_duration_seconds summarygo_gc_duration_seconds{quantile="0"} 0.000111075go_gc_duration_seconds{quantile="0.25"} 0.000244251go_gc_duration_seconds{quantile="0.5"} 0.000264236go_gc_duration_seconds{quantile="0.75"} 0.000295209go_gc_duration_seconds{quantile="1"} 0.000693045go_gc_duration_seconds_sum 187.504344849go_gc_duration_seconds_count 237336・・・アプリの情報も exporter みたいにしたい！概要が理解できると多分こういうことがやりたくなるはずですその時点のユーザー数とか、登録数とかアプリの統計情報を取得するための Json 形式の API を用意しておけば exporter と統合するのは簡単ですkibana でよくやるような、アプリログに出力されたデータから集計するためには Prometheus の FAQ を見てみたら "mtail使え！" と書いてましたログを収集してメトリクス に変換するようなものですねhttps://prometheus.io/docs/introduction/faq/#how-to-feed-logs-into-prometheus?https://github.com/google/mtailデータを可視化する監視対象から取得されたデータは、Prometheus 内の時系列データベースに保存されますPrometheus サーバーにデフォルトで付いている GUI を使うと、こんな感じにグラフが表示できますデータの取得には Prometheus のクエリを使いますこれがなかなか難しいですが、ググればだいたいのことは誰かが解説してくれているものが見つかるので、クエリを自分で組み立てられなくてもとりあえずは困らないはずです例えば、各マシンのCPU使用率を取得するためには以下のようなクエリを書きます例)CPU使用率を取得するクエリ100 - (avg by (instance) (irate(node_cpu{mode="idle", instance=~"^%s:.+"}[5m])) * 100)Grafana で可視化するPrometheus のデフォルト GUI だと非常に見た目がしょぼくて機能も少ないですPrometheus 自体のメイン機能は監視サーバーとDBの役割なのでそこは仕方ないでしょうGrafana という可視化ツールと組み合わせると、イケてる見た目で非常に使いやすくなりますPrometheus と Grafana の関係は、elasticsearch と Kibana の関係のような感じです※Grafana の解説 10分で理解する Grafana の記事も書きました！https://qiita.com/Chanmoro/items/a23f0408f0e64658a775もう一歩踏み込みたい方はこちらの記事が非常にわかりやすいのでこの次に読んでみましょう！次世代監視の大本命！ Prometheus を実運用してみた以上、快適なリソース監視ライフを！

10分で理解する Prometheus

Packer とはサーバーイメージを作成するためのツールですAWSであればAMI、Azureであれば arm を作成しますVagrant を開発している HashiCorp社 が開発しているツールなので使用感は Vagrant と同じような感じです構築済みのサーバーイメージをAMIとして作成しておき、これをベースとしてインスタンスを立ち上げるのはよくあるパターンだと思います※ "ゴールデンイメージ" というインフラパターンらしいですただ、このAMIがどうやって作られたか？がわからなくなりがちなのですが、Packerを使うことでAMI構築手順を全てコード化することができますTL;DRjson ファイルに定義内容を記述し、$ packer build hoge.json を実行するだけで定義内容の通りに自動でサーバーイメージを作成してくれますインストール以下に従って OS 毎のビルド済みバイナリをダウンロードしてきてパスを通すだけですhttps://www.packer.io/downloads.htmlMac の場合Mac の場合は Homebrew でインストールできますHomebrewでpackerインストール$ brew update$ brew install packerAWS での使い方事前準備IAM ユーザーを作るaws cli を利用するための アクセスキーを取得します管理者に依頼して IAM ユーザーを作成してもらってくださいhttps://console.aws.amazon.com/iam/home?#/home利用したい AWS サービス(EC2だけかな？)に対しての操作権限をつけてもらう必要がありますAWS CLI をセットアップする以下を参考に aws コマンドを使えるように設定するhttp://docs.aws.amazon.com/ja_jp/streams/latest/dev/kinesis-tutorial-cli-installation.html$ aws configure で認証情報をセットした後であれば、Pakcer からはこのAWS認証情報を参照してくれます※~/.aws/credentials にAWSの認証情報が保存されますAMIを作成する1. json ファイルを作成する例として以下の AMI を作成する定義を見てみましょう項目設定値メモリージョンap-northeast-1 (東京)ベースのAMI公式 ubuntu 16.04 の最新版インスタンスタイプt2.microssh ユーザー名ubuntuAMIの名前Packer test  YYYY-MM-DDThh-mm-ssZ作成時のタイムスタンプがセットされるディスク30GB、gp2 の EBS を /dev/sda1 として接続初期化コマンドapt update を実行してから python-simplejson をインストールこの AMI 定義は以下のように  json ファイルで書きます定義できる項目は packer のドキュメントを参照のことhttps://www.packer.io/docs/builders/amazon.htmlpacker-example.json{  "builders": [{    "type": "amazon-ebs",    "region": "ap-northeast-1",    "source_ami_filter": {      "filters": {        "virtualization-type": "hvm",        "name": "*ubuntu-xenial-16.04-amd64-server-*",        "root-device-type": "ebs"      },      "owners": ["099720109477"],      "most_recent": true    },    "instance_type": "t2.micro",    "ssh_username": "ubuntu",    "ami_name": "Packer Test {{isotime | clean_ami_name}}",    "launch_block_device_mappings": [{      "delete_on_termination": true,      "device_name": "/dev/sda1",      "volume_size": 10,      "volume_type": "gp2"    }]  }],  "provisioners": [{    "type": "shell",    "inline": [      "sudo apt update",      "sudo apt install -y python-simplejson",      "sudo echo `date`' - packer provisioned this AMI' > /home/ubuntu/packer_provisioners"    ]  }]}2. 構文チェック$ packer validate を実行すると構文チェックされます$ packer validate packer-example.json以下のメッセージが出力されれば構文チェックはOKですTemplate validated successfully.もしエラーがある場合はエラーメッセージが出力されます$ packer build packer-example.json Failed to parse template: Error parsing JSON: invalid character '"' after object key:value pairAt line 4, column 6 (offset 49):    3:     "type": "amazon-ebs"    4:     "           ^3. ビルド実行$ packer build を実行して AMI をビルドします$ packer build packer-example.json初期化タスクの内容にもよりますが AMI ビルドには数分かかります以下のように AMIs were created と出力されればビルド成功です・・・Build 'amazon-ebs' finished.==> Builds finished. The artifacts of successful builds are:--> amazon-ebs: AMIs were created:ap-northeast-1: ami-c5f49528ビルド中 EC2 のコンソールを開くと "Packer Builder" というインスタンスが起動されて、このインスタンス内で処理が実行され定義した内容の AMI が作成されますビルドが完了すると以下のように AMI が追加されていることが確認できます[Advanced] イメージの初期化処理を Ansible でやるpacker で provisioners で設定したタスクによりイメージの初期化を行うことができますhttps://www.packer.io/docs/provisioners/index.html↑のサンプルでは  Shell Provisioner を使うことで、イメージとなるインスタンスの内部で指定されたシェルコマンドが実行されていたということですAnsible Provisioner というのを使うと、初期化タスクを ansible に任せることができます先ほどの packer-example.json を修正し Provisioner に ansible を指定しますplaybook_file に指定された playbook に沿って ansible が実行されます※playbook の書き方はここでは割愛しますpacker-ansible.json{  "builders": [{    "type": "amazon-ebs",    "region": "ap-northeast-1",    "source_ami_filter": {      "filters": {        "virtualization-type": "hvm",        "name": "*ubuntu-xenial-16.04-amd64-server-*",        "root-device-type": "ebs"      },      "owners": ["099720109477"],      "most_recent": true    },    "instance_type": "t2.micro",    "ssh_username": "ubuntu",    "ami_name": "Packer Ansible Example {{isotime | clean_ami_name}}",    "launch_block_device_mappings": [{      "delete_on_termination": true,      "device_name": "/dev/sda1",      "volume_size": 30,      "volume_type": "gp2"    }]  }],  "provisioners": [{    "type": "shell",    "inline": [      "sudo apt update",      "sudo apt install -y python-simplejson"    ]  }, {    "type": "ansible",    "playbook_file": "./ansible/playbook.yml"  }]}

10分で理解するPacker

Docker コンテナのタイムゾーンの変更Docker コンテナでタイムゾーン設定は Dockerfile で特定のタイムゾーンへ変更するよりも、実行時に環境に合わせて外から変更できる方が移植性が高い状態を保つことができますそのために、コンテナ起動時に /etc/localtime へ任意のタイムゾーンファイルをアタッチすることで設定しますタイムゾーンの設定の仕方タイムゾーンは /etc/localtime で定義されていますこのファイルはシンボリックリンクになっていて、向き先を任意のタイムゾーンファイルに変えることでタイムゾーンが変更されます$ ls -l /etc/localtimelrwxrwxrwx 1 root root 32 May 29 14:22 /etc/localtime -> ../usr/share/zoneinfo/Asia/TokyoDocker コンテナのタイムゾーンを外から設定するDocker ホスト側と同じタイムゾーンに設定するDockerコンテナを起動するホスト側の /etc/localtime をコンテナ側に読み取り専用でアタッチすると、ホスト側のタイムゾーンと同じにすることができます$ sudo docker run -it --rm -v /etc/localtime:/etc/localtime:ro ubuntu:16.04 dateWed Jun 8 20:50:16 JST 2018Docker ホスト側と別のタイムゾーンを設定するホストと別のタイムゾーンに設定したい場合でも、ホスト側に持っている定義ファイルを /etc/localtime にアタッチすれば OK$ sudo docker run -it --rm -v /usr/share/zoneinfo/America/Los_Angeles:/etc/localtime:ro ubuntu:16.04 dateTue Jun 8 20:54:16 PDT 2018※元ネタはこちらを参考にしましたhttps://stackoverflow.com/questions/22800624/will-docker-container-auto-sync-time-with-the-host-machine/22820278#22820278

dockerコンテナ内のタイムゾーンを変更する

Nextremer Advent Calendar 2017 14日目の記事ですLispという言語に皆さんは触れたことがあるでしょうか？「神の言語」とも言われるLisp、プログラマーであれば一度は気になったことがあるんじゃないでしょうかNextremerにはLisperのメンバーが若干名おり、そのお陰で最近はたまにNextremerのオフィスでLispの勉強会であるShibuya.lispが開催されたりしています私自身は今まで一度もLisp系の言語をちゃんと勉強したことがなかったんですが、会社のslackでうっかりCommon Lispやってみたいてきなことを呟いたらLisperの方々が反応してくれましたこのやり取りをきっかけに、最近じわじわと社内でCommon Lisp熱が高まりつつありますCommon Lisp を使おう！Common Lisp環境のセットアップ、Hello world的な解説や基本的な構文などを@t-sinさんが記事にまとめられていますとてもわかりやすく参考にさせていただきました！いまから始めるCommon LispDockerイメージを作ろう！Nextremer内の自称Dockerエバンジェリストとしては、何か新しいアプリケーションを開発するときに何でもDockerにしてしまいたい欲望がありますRoswellとSBCLをインストール済みのDockerイメージを作ってDocker Hubにアップしました・Docker Hubhttps://hub.docker.com/r/chanmoro/docker-roswell/・githubリポジトリhttps://github.com/KazukiMorozumi/docker-roswellWebAPIを作ってみよう！先ほども紹介した@t-sinさんの記事で紹介されているWebAPIと同じものを実装して、Dockerコンテナ内で動かしてみますソースコード一式は以下に置きましたhttps://github.com/Chanmoro/commom-lisp-webapp-exampleこのリポジトリをクローンして $ docker-compose up を実行するとWebサーバーが起動します初回の実行は各種ダウンロードで少し時間がかかります起動した後は localhost:5000 で以下のようにアクセスできます$ curl localhost:5000Hello CL with Docker!$ curl localhost:5000/post/list[{"ID":1,"TITLE":"記事1","DATE":"2017-01-01","TAGS":["tag1","tag2","tag3"]},{"ID":2,"TITLE":"記事2","DATE":"2017-01-02","TAGS":["tag2","tag3"]},{"ID":3,"TITLE":"記事3","DATE":"2017-01-03","TAGS":["tag1","tag3"]}]$ curl localhost:5000/post/id/1{"ID":1,"TITLE":"記事1","DATE":"2017-01-01","TAGS":["tag1","tag2","tag3"],"BODY":"本文1本文1本文1本文1"}コード自体は特に困ったところはなかったんですが、Dockerイメージを作るのにちょこちょこ細かいところでハマったので以下にまとめますDockerコンテナ化する際にハマった点WARNINGが出るビルド時や ros コマンドの実行時に以下のようなWarningが出ますWARNING:Couldn't re-execute SBCL with proper personality flags (/proc isn't mounted? setuid?)以下のwikiにこれについての対応方法が書かれていましたhttps://github.com/dimitri/pgloader/wiki/Running-in-Docker-(SBCL-warning)どうやらなんらかのシステムコールを実行する必要があり、Dockerのセキュリティ機構の seccomp を無効にするか、システムコールを実行する許可の設定をすることで該当のWarningが消えますhttps://github.com/daewok/slime-docker/blob/master/resources/docker-sbcl-seccomp.jsonseccompを設定する際は以下のように --security-opt オプションで指定しますdocker run -it --security-opt seccomp=./docker-sbcl-seccomp.json chanmoro/docker-roswell bashseccompの設定をしなくてもビルドは成功しますし、その後の処理も動くので無視したままでも動作はするようでした※そもそものWarningの内容をよく理解していないので、今後問題になるようだったら詳細調べてみるかもです・・・Common Lispのソース内に日本語があるとエラーになる無事Dockerイメージがビルドできたと思ったら、今度はAPIサーバーの実行時に以下のようなエラーが出ました  :ASCII stream decoding error on  #<SB-SYS:FD-STREAM for "file /app/app.lisp" {1003857E83}>:    the octet sequence #(232) cannot be decoded.何らか文字コードが関係していそうで、いろいろとググるとどうやらlocaleが関係していそうでした今回ベースに利用しているubuntu 16.04のイメージは、デフォルトの状態だとlocaleはこのように POSIX が設定されています# localeLANG=LANGUAGE=LC_CTYPE="POSIX"LC_NUMERIC="POSIX"LC_TIME="POSIX"LC_COLLATE="POSIX"LC_MONETARY="POSIX"LC_MESSAGES="POSIX"LC_PAPER="POSIX"LC_NAME="POSIX"LC_ADDRESS="POSIX"LC_TELEPHONE="POSIX"LC_MEASUREMENT="POSIX"LC_IDENTIFICATION="この状態だとエラーとなるので、aptでlocalesをインストールしDockerfile内で以下のようにlocaleにen_US.UTF-8をセットすることで日本語のエラーが解決しましたRUN locale-gen en_US.UTF-8ENV LANG en_US.UTF-8ENV LANGUAGE en_US:enENV LC_ALL en_US.UTF-8Common Lispの各種パッケージをどのタイミングでインストールしたらいいかわからないコンテナを気にせず普通に実行する場合はapp.lisp内の以下のようにquickloadを利用するとライブラリのダウンロードが自動で行われます(ql:quickload '(:ningle) :silent t)(ql:quickload '(:jonathan) :silent t)しかし、Dockerイメージ化する上では各種ライブラリがダウンロード済みの状態のイメージを作りたいです結果として以下のようにDockerfile内でライブラリを読み込んでダウンロードするようにしましたRUN echo 'install libs' \  && ros -s ningle \  && ros -s jonathanこの悩みを弊社のLisperである@gos_kさんに聞いてみたところ、以下のリポジトリを教えてくれましたhttps://github.com/Rudolph-Miller/dockerfile-clack/blob/master/Dockerfileさらにros -e "(ql:quickload :hoge)"のようにコードを実行する方法ではなくros -s hogeとしてquickloadだけ実行するのがナウいと教えてくれたのでこの方法を使いましたみんなでCommon Lispしよう！さて、今回はCommon Lispで実装したWebアプリケーションをDockerで動かそう、というのにトライしましたこれでポータビリティーも最強になったので、Common Lispで実装したソフトウェアを思う存分投入できますね！まだまだCommon Lispを触り始めたばかりなので分からないことだらけですが、今後も引き続き勉強させていただきます！あまりLisp系言語やCommon Lispについてゆるふわなことばかり言っていると、どこかからマサカリが飛んで首を持っていかれそうな気がするので、初心者はこのあたりで黙っておきます