スマホでレシートを撮影して家計簿へ自動入力する機能を作ろうとしている

自作しているお金管理アプリに、スマートフォンでレシートを撮影して、支出情報を自動入力する機能を追加した。

やりたかったことはシンプル。

レシートを撮影すると、

• 日付
• 合計金額
• 店舗名

を画像から読み取り、既存の入出金登録フォームへ自動で反映する。

最後に内容を確認して「保存する」を押せば、支出として登録できる。

まずはローカルで実装

23:33。

Codexに、

スマートフォンからレシートを撮影し、画像から支出情報を抽出して、既存の入出金登録フォームへ自動入力できる機能を追加してください。

と依頼した。

5分34秒後、実装完了。

「入出金 → 新しく登録」に「レシートから入力」というエリアが追加された。

できるようになったことは、

• スマートフォンでレシートを撮影
• 画像ファイルを選択
• 日付・合計金額・店舗名を読み取る
• 結果を確認・修正
• 既存フォームへ反映
• 保存

という流れ。

自動テストも12件通過していた。

ただ、この段階ではまだローカル環境だけ。

本番には反映していない。

スマホからMacのローカル環境を開く

次にやりたかったのは、実際にiPhoneでレシートを撮影して試すこと。

Mac上では、

127.0.0.1:3001

でアプリを動かしている。

ただし、127.0.0.1はその端末自身を意味するため、そのままではiPhoneからMacのRailsアプリへアクセスできない。

そこでRailsを、

0.0.0.0:3001

で待ち受けるようにして起動した。

MacとiPhoneを同じWi-Fiに接続して、

192.168.110.104:3001

へアクセス。

これでスマホから、自分のMacで動いているMoneyAppを開くことができた。

最初の実機テストは「読み取りに失敗」

23:53。

実際のバローのレシートをスマホから選択してみた。

画像自体はきちんとプレビューされた。

ただ、その下に表示されたのは、

読み取りに失敗しました。通信環境を確認するか、明るい場所で撮り直してください。手入力も利用できます。

というメッセージ。

ここで、

AIを組み込むとうまくいきますか？

と考えた。

画像を理解できるAIを使えば、傾いたレシートや複雑なレイアウトでも読み取りやすくなる。

ただし、AIを使うとなると、

• APIキー
• 従量課金
• 外部サービスへの画像送信

なども発生する。

今回の仕組みは、レシート画像を外部に送信せず、端末内でOCRする設計だった。

なので、いきなりAIを追加するのではなく、まず現在のOCRがなぜ失敗しているのかを調べることにした。

原因はOCRライブラリの読み込み方だった

調査してもらうと、最初のエラーの原因が判明した。

OCRライブラリの読み込み方法のミスだった。

つまり、

「OCRでは読み取れない」

のではなく、

「そもそもOCRが正しく起動していない」

状態だった。

修正後、OCRエンジンそのものでは日付や金額を抽出できることが確認できた。

新しいAIサービスを追加する必要はなかった。

深夜0:41、もう一度iPhoneで試す

日付が変わって0:41。

同じレシートを使って、もう一度iPhoneから試した。

今度は前回と明らかに挙動が違った。

画像を選択すると、

読み取り中… 0%

と表示された。

OCR処理そのものは動き始めている。

0:42には、

読み取り中… 39%

まで進んだ。

最初の「即エラー」からは一歩前進した。

ただし、しばらく待っても39%付近から進まない。

そして0:43。

最終的に、

読み取りが時間内に完了しませんでした。
通信環境や画像を確認して再度お試しください。

というメッセージが表示された。

今回使ったレシートには、

• 店舗：Valor
• 日付：2026年9月24日
• 合計：3,275円

とはっきり印刷されている。

しかしスマホでの今回のテストでは、OCR処理が完了する前にタイムアウトしたため、金額などをフォームへ自動入力するところまでは到達しなかった。

画面に表示されていた「2026/09/26」もレシートの日付ではなく、登録フォーム側の当日の日付だった。

それでも、一段階は前に進んだ

今回のスマホ実機テストでは、最終的な読み取りにはまだ成功していない。

ただ、最初と2回目では問題が違う。

最初は、

OCRライブラリ自体が正しく動いていなかった。

修正後は、

OCRは起動し、0% → 39%まで処理が進んだものの、スマホ上では時間内に終了しなかった。

という状態になった。

つまり次に調べるべきポイントもかなり絞られた。

考えられるのは、

• スマホでのOCR処理速度
• 読み込ませる画像サイズ
• OCR前の画像縮小
• タイムアウト時間
• 日本語OCRデータの読み込み時間
• 初回のみ発生するOCRエンジンのダウンロード時間

など。

「読み取りに失敗した」という一つの現象でも、原因は毎回同じとは限らない。

自宅のWi-Fiの通信環境が途切れるタイミングがあることが原因かもしれない。（この問題は以前から継続している）