自作Chrome拡張機能「GPT-ChatDIY」の進展
2023/09/04 追記
公開されました!
すっかりマイブームになりました、Chrome拡張機能(GPT-ChatDIY)の進展です。
マガジンも作成しましたので、そちらにも情報をまとめていきます。
今時点(23/9/3)でまだ審査中ですが、いくつか機能を追加しました。
具体的には、「多言語対応」と「個人情報チェック機能」を実装しました。
ある程度個人でも組織でも使いやすいものを思想として更新していく予定です。
アップデート予定
以下がアップデート予定です。
実装時期は内容によって前後するかも知れません。
多言語対応
こちらはもともと日本語だったり英語だったり混在していたので、設定でどちらかに統一できるようにしました。
ChatGPTに実装してもらう際には、一気に処理させると不完全になることが多々あったので、分割して依頼しています。
例として実装のサンプルがあると早いですね。
個人情報チェック(個人情報入力抑止)機能
こちらは正規表現による実装と、辞書とのマッチングによる実装を今時点で行っています。
OpenAI社はAPI経由で学習しないとは言っていますが、そもそも送信してしまうこと自体良くないと思う組織、個人用です。
誤って送信する前にそれを検知してアラートを出します。
現状、辞書登録されているものは絶対に送信されません。
電話番号、郵便番号、メールアドレスと検知したものは、送信するかしないかを選べるようにしています。
今後、それらをマスキングして送信機能もつけようと思います。
また、エラーメッセージにも統一性が無いため、その辺も修正予定です。
コーディングとデバッグ
コーディング
いくらほとんどChatGPTにコーディングしてもらうとは言え、メモ帳だとあまりに見辛いのでサクラエディタを使い始めました。(前からたまに使っていましたが。)
設定→タイプ別設定→半角空白にチェックを入れると、それが可視化されるため、誤って全角の空白が入っている、という事態も防げるので便利ですね。
デバッグ
期待通りに動かないときに、これもブラウザのデバッグ機能を使うと便利です。
今回の場合であれば、拡張機能で右クリック→検証を選択します。
そうしたら別ウインドウでDevToolsが立ち上がるので、コンソール→Chatgpt.js(今回であれば)→そして、確認したい処理の行番号を押します。
これでこの行にブレークポイントが設定されます。(青く着色された行)
設定されると、処理はこの行で止まります。
通常の使い方(今回は意図的にチェックにひっかかるようにプロンプトを送信)をすると、そのブレークポイントで処理がストップします。
止まった、この時の変数に何が格納されているかを見ることで、問題を特定しやすくなります。
デバッグエリアを作成することも検討できます。
自分は設定の下の方にデバッグエリアを追加しました。
まとめ
こうやって形になってくると楽しいですね。
色々実装したい機能をリストアップして、そこから実装までにかなり速く辿りつける気がします。
また、なぜこういった実装なのかをChatGPTに聞きながらコーディングすることで勉強にもなりますね。
この記事が気に入ったらサポートをしてみませんか?