【ITニュース解説】Meetup Events Scraper: the search page ships its whole Apollo cache, and that is the API

システムエンジニアを目指す皆さんにとって、ウェブサイトから情報を効率的に取得する技術は非常に興味深いテーマだろう。今回紹介する「Meetup Events Scraper」は、まさにそのような技術を使ってMeetup.comのイベント情報を収集するツールだが、そのデータの取得方法が非常にユニークで、現代のウェブ開発の裏側を学ぶ良い機会となる。

このスクレイパーは、Meetup.comというイベント開催サイトから、特定のキーワードや都市に基づいて公開されているイベント情報を自動で収集する。取得できるデータは、タイトル、開催日時（タイムゾーン付き）、対面かオンラインか、会場（座標付き）、参加予定者数、イベント定員、料金、そしてイベントを主催するグループの情報など、多岐にわたる。これらの情報はJSON、CSV、またはExcel形式で出力されるため、分析や他のシステムとの連携に活用できる。特筆すべきは、Meetupのアカウントにログインしたり、APIキーを取得したりする必要が一切ない点だ。

通常、ウェブサイトから自動でデータを取得しようとすると、公式に提供されているAPI（Application Programming Interface）を利用するのが一般的である。しかし、Meetupは一般ユーザーがイベント情報を検索・取得するための汎用的な公開APIを提供していない。Meetupが提供するAPIは、主に「Meetup Pro」というビジネス向けの有料プラン利用者向けに提供されており、特定のグループが自身のネットワークを管理したり、他のシステムと連携したりすることを目的としている。つまり、一般の利用者が「来月ニューヨークでどんなAI関連のMeetupがあるか、何人が参加予定か」といった情報をプログラムで取得しようとしても、公式APIは利用できないのが現状だ。

では、このスクレイパーはどのようにしてデータを手に入れているのだろうか。その秘密は、Meetupのウェブサイトが使っている技術と、そのデータの「見せ方」にある。Meetupのウェブサイトは「Next.js」というJavaScriptフレームワークで構築されている。Next.jsで作られたウェブサイトの多くは、ページがブラウザに表示される前に、サーバー側で必要なデータを使ってHTMLを生成する。このとき、ページをレンダリングするために使われたデータが、HTMLの一部としてブラウザに送られる。具体的には、ページのソースコードの中に<script id="__NEXT_DATA__">という特別なHTMLタグがあり、その中にページを構成するための元となるデータがJavaScriptオブジェクトとして埋め込まれている。

このスクリプトタグの中を詳しく見ると、props.pageProps.__APOLLO_STATE__という部分に、Meetupが利用している「Apollo Client」というライブラリのキャッシュデータが格納されているのがわかる。Apollo Clientは、「GraphQL」というデータ取得のための言語と組み合わせて使われることが多い。GraphQLは、クライアント側がサーバーから必要なデータを細かく指定して取得できる、非常に柔軟な仕組みである。Meetupのサイトでは、イベント検索結果をGraphQLで取得し、その結果をApollo Clientが内部で「キャッシュ」として保存している。このキャッシュは、データを特定の形式で保存するデータベースのようなもので、同じデータが複数回必要になったときにサーバーに再度問い合わせることなく、高速に表示するために利用される。

このApolloキャッシュの特徴的な点は、データが「正規化」されて保存されていることだ。正規化とは、同じデータが重複しないように、IDを使って関連するデータを参照する形に整理されることである。例えば、検索結果には「ROOT_QUERY」というメインのデータと、具体的なイベントを示す「Event:イベントID」や、主催グループを示す「Group:グループID」といった複数の「エンティティ」が存在する。これらのエンティティは、それぞれが一意のIDで識別される。イベントデータの中には、そのイベントを主催しているグループへの「ポインタ」として、{"__ref": "Group:29431902"}のように、具体的なグループデータそのものではなく、そのIDへの参照が記述されている場合が多い。これは、もし同じグループが複数のイベントを主催している場合でも、グループの情報を何度も繰り返して持つのではなく、一度だけ保存し、他の場所からはそのIDを参照するだけで済むようにするためである。

したがって、このスクレイパーのデータ解析部分では、HTMLの要素を一つ一つ探していく「DOMウォーク」と呼ばれる一般的なスクレイピング手法ではなく、この埋め込まれたApolloキャッシュを直接読み込み、ポインタ（__ref）を解決して、バラバラになったエンティティを紐付けていく作業が行われる。ポインタを解決するとは、{"__ref": "Event:315229748"}という記述を見つけたら、キャッシュ内のEvent:315229748というキーに対応する実際のイベントデータを取得してくることである。これは、プログラミングにおける参照渡しやオブジェクト指向の概念にも似ており、複雑なデータ構造を効率的に扱うための重要なテクニックだ。

しかし、このキャッシュを扱う上ではいくつかの注意点もある。例えば、検索条件が変わると、キャッシュ内の検索結果を指すキーの名称も変わってしまうため、特定のキーをハードコードしてはならない。また、前述の通りデータはポインタとして存在するため、直接「イベントタイトル」にアクセスしようとするとエラーになる。必ずポインタを解決してから実際のデータにアクセスする必要がある。さらに、「無料イベント」であるかどうかは、isFreeのような明確なフィールドがあるわけではなく、料金設定を示すfeeSettingsフィールドがnullであることで判断する必要がある。オンラインイベントの場合も、形式上「会場」の情報が存在するが、それは単なる空の文字列を持つプレースホルダーであり、実質的な情報としては扱えないため、適切に処理してnullとして扱う工夫も必要だ。参加者数については、参加予定の合計数のみが提供され、個々の参加者の個人情報は一切含まれないため、プライバシー保護の観点からも安全な設計となっている。

このスクレイパーが提供するデータは、検索キーワード、イベントID、タイトル、URL、日時、イベントタイプ、オンラインか否か、参加予定者数、最大定員、無料か否か、料金、会場名、住所、座標、グループ名、グループURL、イベント説明文など、23種類に及ぶ詳細なフィールドで構成されている。これにより、ユーザーは多角的にイベント情報を分析できる。一方で、このスクレイパーにはいくつかの限界もある。一度のリクエストで取得できるイベント数は、Meetupの検索結果1ページ分、およそ27イベントが上限となる。それ以上のページを自動で辿る機能は持たないため、より広範囲のイベント情報を得るには、検索キーワードを増やすなどの工夫が必要だ。また、取得できるイベントの最大数も1キーワードあたり500件までという制限がある。

システムエンジニアを目指す皆さんにとって、このようなツールがどのようにして作られ、どのようにして課題を解決しているかを知ることは、非常に貴重な学びとなるだろう。ウェブサイトがブラウザに表示される裏側でどのようなデータがやり取りされているのか、Next.jsやApollo GraphQLといった最新のウェブ技術がどのように使われているのか、そして、表向きにはAPIが提供されていない状況でどのようにして情報を取得するのか、といった実践的な知識と技術的思考を養う良い題材である。このMeetup Events Scraperは、Devil Scrapesという開発元によって運用されており、IPブロックやレート制限の回避、様々なブラウザからのアクセスを模倣する技術、そして取得したデータの品質保証まで、いわゆる「泥臭い」部分を全て引き受けることで、利用者がクリーンなデータだけを受け取れるようにしている。これは、スクレイピングの安定運用がいかに難しいか、そしてその裏でどれだけの技術的努力が払われているかを示す良い例だ。