freegpt — ChatGPT翻訳ページに独自チャットUIを注入する拡張

Tool
freegpt — ChatGPT翻訳ページに独自チャットUIを注入する拡張

freegpt — ChatGPT翻訳ページに独自チャットUIを注入する拡張

このブラウザ拡張「freegpt」は、公式ChatGPTの翻訳ページに対して独自のチャットUIを注入し、モデル選択やsystem/developerプロンプトの差し替えを行えるようにします。ネットワークレベルで /conversation リクエストを傍受し、送信前にペイロードを書き換える仕組みを採ることで、利用者側の設定に基づく動的なリクエスト改変を実現します。簡易なUIと設定で手軽に試せる開発向けのツールです（約300字）。

https://github.com/jonathanyly/freegpt

概要

freegpt は ChatGPT の公式「翻訳ページ」に対して、独自のチャットインターフェースを注入するブラウザ拡張です。設定画面から使用するモデル、system プロンプト、developer プロンプトを指定すると、拡張機能が送信される /conversation リクエストを傍受してこれらの値を置き換えます。結果として公式UIを置き換えつつ、任意のシステム指示やモデル切替を試験的に行える環境をローカルで作れます。簡単に試せる実装で、フロントエンドに自信がなくても動作することを重視している点が特徴です（約300字）。

GitHub

リポジトリの統計情報

  • スター数: 25
  • フォーク数: 2
  • ウォッチャー数: 25
  • コミット数: 10
  • ファイル数: 7
  • メインの言語: JavaScript

主な特徴

  • モデル選択（設定から使用モデルを切り替え）
  • system / developer プロンプトを送信前に差し替え
  • 公式翻訳ページに独自のチャットUIを注入して置換
  • ネットワークレベルで /conversation リクエストを傍受・改変

技術的なポイント

freegpt は「ページにコードを注入して、送信される会話リクエストの内容を書き換える」アプローチを取っています。リポジトリに含まれる content.js と injector.js の命名から推測すると、content script が拡張の入り口となり、実際にページのコンテキストで動作するスクリプト（injector.js）を DOM に挿入して window.fetch や XMLHttpRequest、または内部で使われる通信関数をラップ／オーバーライドする方式を用いている可能性が高いです。こうすることでブラウザ拡張の権限に頼らず、ページが直接送信する POST ボディ（/conversation の JSON）を書き換えられます。

もう一つの一般的な手法は、拡張の background（あるいは service worker）で chrome.webRequest や browser.webRequest API を使い、リクエストを捕捉して書き換える方法ですが、Manifest V3 の制約や CORS、Content-Security-Policy の影響を受けやすいため、ページ注入型のオーバーライドが採られることが多いです。本プロジェクトの README は「ネットワークレベルで /conversation リクエストを傍受」と書かれており、実装詳細としては上記いずれか、あるいは両者の組合せを想定できます。

設定（モデル／system／developer プロンプト）は拡張のオプションページやポップアップで管理され、chrome.storage（または同等の API）に保存されるのが一般的です。注入スクリプトは保存された設定を読み出し、送信直前の JSON に対して target keys を差し替えてからサーバに渡します。注意点としては、OpenAI のリクエストフォーマット変更やエンドポイント変更によって容易に動作が壊れる点、またリクエスト改変は利用規約上の問題を生じ得る点です。

実装上の留意点：

  • fetch/XHR のオーバーライドはページ側のスクリプト順序に依存するため、注入タイミングを工夫する必要があります（早めに挿入する、DOMContentLoaded より前など）。
  • バイパスされないように、可能な限り原始的な送信経路（fetch 原型）をラップすること。
  • ユーザーデータ（プロンプト設定）は暗号的に保護されないため、機密情報の保管は避けること。
  • Manifest バージョンやブラウザ間の API 差異に注意し、MV3 対応や必要な権限の最小化を検討すること。

拡張としての拡張性：

  • UIを改善して対話履歴やテンプレートを保存
  • エラーハンドリングとフォールバック（書き換えに失敗した場合の挙動）
  • ロギングやデバッグモード（安全な範囲で）を追加することで開発者体験を向上できるでしょう。

プロジェクトの構成

主要なファイルとディレクトリ：

  • LICENSE: file
  • README.md: file
  • content.js: file
  • injector.js: file
  • manifest.json: file

…他 2 ファイル

まとめ

公式ページに非侵襲で独自UIとリクエスト上書きを組み込む実験的な拡張。設定で手軽にモデルやプロンプトを切替えられる点が魅力です（約50字）。

リポジトリ情報：

  • 名前: freegpt
  • 説明: This Extension injects into the translation page of chatgpt (offical chatgpt page), replacing it with a fully functional (its heavily vibecoded (with chatgpt) im not a frontend dev) chatpgt UI. You can choose the model, system and developer prompt in the settings.
  • スター数: 25
  • 言語: JavaScript
  • URL: https://github.com/jonathanyly/freegpt
  • オーナー: jonathanyly
  • アバター: https://avatars.githubusercontent.com/u/114871601?v=4