【ITニュース解説】Going from 150s to <1s: Replacing DOM scraping with a site's internal RPC API in a Chrome extension
2026年10月16日に「Dev.to」が公開したITニュース「Going from 150s to <1s: Replacing DOM scraping with a site's internal RPC API in a Chrome extension」について初心者にもわかりやすく解説しています。
ITニュース概要
Chrome拡張機能が、Webページから直接情報を読み取る「DOMスクレイピング」をやめ、サイトの「内部API」を直接使うよう改善された。これにより、会話エクスポートが150秒から1秒未満に高速化され、添付ファイルを含む正確なデータを取得可能に。未公開APIには変更リスクもある。
ITニュース解説
ある開発者が、Google AI Studioの会話エクスポート機能がないことに不便を感じ、その解決策として「AI Studio Exporter」というChrome拡張機能を開発した。この開発の過程で、Webデータの取得方法における大きな進化が実現された事例である。
最初のバージョンであるAI Studio Exporter V1は、一般的なWebデータの取得手法である「DOMスクレイピング」を用いていた。これは、Webブラウザに表示されているWebページの内容(HTMLの構造やテキスト、画像など)を直接読み取り、必要な情報を抜き出す方法である。しかし、この方法にはいくつかの深刻な問題があった。
第一に、処理速度が非常に遅いという問題である。Google AI Studioは、一度にすべての会話メッセージを読み込むのではなく、ユーザーがページをスクロールするにつれて必要な部分だけを動的に表示する仕組みになっている。そのため、拡張機能が全ての会話をエクスポートしようとすると、自動的にページをスクロールし、新しいメッセージが画面に描画されるのをその都度待たなければならなかった。この描画待ちの時間が非常に長く、例えば200メッセージの会話をエクスポートするのに約150秒もの時間を要していた。
第二に、情報が欠落する可能性があった。Webページは、ネットワークの状態やコンピューターの処理速度によって、表示される情報が遅れたり、完全に表示されなかったりすることがある。DOMスクレイピングでは、画面に描画されていない情報は取得できないため、長い会話の途中のメッセージが失われたり、不安定な環境下ではさらに多くの情報が欠落したりするリスクがあった。
第三に、添付ファイルの実体を取得できないという問題があった。Webページ上では、PDFなどの添付ファイルは小さなプレビュー画像として表示されるに過ぎない。DOMスクレイピングでは、このサムネイル画像しか取得できず、元のPDFファイルそのものをエクスポートすることは不可能であった。これは多くのユーザーにとって不満の種となっていた。
これらの問題は、Webページが表示している内容が、サーバー上に存在する元のデータの「一部を人間が見やすい形に加工したもの」に過ぎないことに起因する。そこで開発者は、Webページを介さず、サーバーに直接問い合わせることでこれらの問題を解決できると考えた。
開発者は、Webブラウザの「開発者ツール」にある「Network」タブを使って、Google AI StudioのWebページが会話を読み込む際に、裏側でサーバーとどのような通信を行っているかを詳細に調査した。その結果、「ListPrompts」「ResolveDriveResource」「GenerateAccessToken」といった特定のAPIメソッドが、会話データの取得に重要な役割を果たしていることが判明した。これらの内部APIを拡張機能から直接呼び出すことで、Webページの表示状態に左右されずに、高速かつ正確に完全なデータを取得できると考えた。
しかし、これらの内部APIは公開されておらず、そのデータ形式も一般的なJSONではなく、protobufという形式に似た、ネストされた配列の構造をしていた。どの配列の位置にどのようなデータが格納されているのかはドキュメント化されていなかったため、開発者はWebページのUI表示とAPIのレスポンスを地道に比較しながら、手作業でデータを解析し、そのデータを正しく解釈するためのデコーダを構築する必要があった。この解析作業では、「Temperature」と「Top-P」のように値が似ているフィールドを誤解したり、「思考プロセス」と「最終的な回答」を区別し損なったりするなど、多くの試行錯誤があった。これは、たとえ多くのテストが成功していても、現実の多様なデータで初めて問題が顕在化するという、ソフトウェア開発における重要な教訓となった。
また、未公開APIはGoogleによっていつでも仕様が変更される可能性があるため、拡張機能はデータの読み取りに「耐障害性のある」処理を実装している。これは、もしAPIのデータ形式が変わっても、エラーで拡張機能が停止するのではなく、単に一部のメタデータが取得できないだけで済むようにする工夫である。
Chrome拡張機能からWebサイトの内部APIを直接呼び出す際には、「CORS(Cross-Origin Resource Sharing)」というセキュリティ上の障壁に直面した。AI StudioのAPIは、https://aistudio.google.comという特定のオリジン(Webサイトのドメイン)からのアクセスのみを許可するように設定されていた。しかし、Chrome拡張機能のコンテンツスクリプトは、Webページとは異なる「Isolated World」という分離された環境で実行されるため、ブラウザは拡張機能からのAPIリクエストをCORSポリシー違反として拒否してしまう。
この問題を解決するため、開発者はWebページと同じ「MAINワールド」で動作するごく小さなスクリプトを導入した。このスクリプトは、Webページが読み込まれる直前にWebページ自身のコンテキストに注入される。拡張機能の本体は「Isolated World」で実行され、window.postMessageという安全なメッセージング機構を通じて「MAINワールド」のスクリプトと通信する。「MAINワールド」のスクリプトがAPIリクエストの仲介役となることで、APIリクエストはWebページ自身のオリジンから行われたものと見なされ、CORSの制限を回避できるようになった。また、この方法により、認証に必要なdocument.cookieにアクセスすることも可能になった。
APIにアクセスするための認証方法も複雑であった。GoogleのWebエンドポイントは「SAPISIDHASH」という独自の認証スキームを使用している。これは、ブラウザのクッキーに含まれる「SAPISID」という値と現在のUNIXタイムスタンプ、そしてAPIリクエストのオリジンを使ってSHA-1ハッシュ値を生成し、それをリクエストヘッダーに含めることで認証を行う仕組みである。さらに、Google Driveに保存されている添付ファイルの実データを取得するためには、OAuthという別の認証方式が必要であった。拡張機能は「GenerateAccessToken」というAPIを呼び出してGoogle Drive用のベアラートークンを取得し、それを利用してDrive APIから実際のファイルをダウンロードするようにした。これにより、エクスポートされる会話には、単なるサムネイルではなく、アップロードされたPDFなどの実際のファイルが含まれるようになった。Google独自のファイル形式(Googleドキュメント、スプレッドシートなど)は、それぞれの最適な形式(Markdown、CSV、PDF、PNGなど)に変換してエクスポートされる。ただし、メモリ枯渇を防ぐため、100MBを超えるファイルはダウンロードせずに拒否される。
未公開APIを利用することには常に変更のリスクが伴うため、開発者は「フォールバック」機能を実装した。もしAPI経由でのデータ取得が失敗した場合でも、拡張機能が完全に機能しなくなることを防ぐため、旧来のDOMスクレイピング方式に自動的に切り替わるように設計されている。この際、ユーザーにはAPIではなくDOMスクレイピングが使われたことがツールバーの表示で通知され、その結果としてモデル設定、トークン数、タイムスタンプ、実際の添付ファイルなどの情報が欠落することが明示される。このフォールバック機能が実際に動作することを保証するため、Playwrightというツールを使ったブラウザテストを導入し、API呼び出しを意図的に失敗させた状態でエクスポートが正しく行われることを確認している。これは、普段使われない機能であっても、いざというときに確実に動作するための重要な品質保証のプロセスである。
開発の過程では、テストに関する重要な教訓も得られた。多くの単体テストが成功し「グリーン」の状態であったにもかかわらず、226メッセージと42個の添付ファイルを含む実際の会話をエクスポートした際に、同じ名前の添付ファイルが存在する場合に、それらへのリンクが壊れるというバグが発見された。これは、テストデータに同名添付ファイルのケースが含まれていなかったためであり、テストデータは現実世界の多様なデータに基づいて作成することの重要性を示している。
また、Chrome拡張機能の新しい仕様であるManifest V3 (MV3)への対応も行われている。定期的なバックアップ機能では、chrome.alarmsというAPIと、一時的に停止する可能性がある「サービスワーカー」という仕組みを使用するため、アラームが起動するたびに、必要な状態情報をストレージから再構築する必要がある。APIへのアクセスにはWebページのオリジンが必要であり、アーカイブの作成にはDOM操作が必要となるため、実際のデータエクスポートはサービスワーカー内ではなく、バックグラウンドで一時的にAI Studioのタブを開き、そこでコンテンツスクリプトに実行させるという工夫がなされている。MV3では拡張機能が要求する権限がより厳しくなっているため、この拡張機能は必要な権限を最小限に抑え、不要な権限は削除された。ファイルダウンロードも、downloads権限を必要としないBlob URLとアンカータグの組み合わせで実現している。さらに、開発中に、アーカイブ内のファイルパスが長すぎるとWindows環境で問題が発生することが判明したため、添付ファイル名の長さを制限する対応も施された。
この拡張機能は未公開APIを利用しているため、GoogleによってAPIの仕様が変更されるリスクは常に存在する。もしAPIが変更された場合、拡張機能は一時的にDOMスクレイピングにフォールバックすることになり、修正・更新が必要となる。また、Googleの利用規約がこのようなツールをどのように見なすかは不明確である。拡張機能はWebブラウザが通常行うリクエストと同じものを、ユーザー自身のログインセッションから行っているため、現状はオープンなリスクとして認識されている。有料のプロ機能も、オープンソースのJavaScriptコードとして実装されているため、技術的には誰でも制限を解除できるが、開発者はコードの保守性や監査性を優先し、難読化は行っていない。未公開APIの変更をどのように検知し、迅速に対応していくかは、今後の運用における課題である。