【実録】既存のGA4分析サンプルアプリをGoogle AI Studioへ移行!エラー・コストと本音レビュー

はじめに

皆さん、こんにちは。okamoです。

過去の記事 【Firebase Studio】環境構築不要!Genkit×MCPでGA4分析AIアプリを作る全工程とプロンプト完全ガイドで、Firebase Studioのサンプルアプリ(GA4分析アプリ)を紹介しました。

この記事で作成したサンプルコードをAI Studioに移行しましたので、その過程を実録でお届けします。 今回は過去の記事 【実録】Firebase StudioからGoogle AI Studioへ移行してみた!手順と注意点を徹底解説 で紹介した「Prepare for AI Studio」ボタンは使わずに、AI Studioのhello worldアプリを既存ソースで上書きして、その後、Geminiに修正してもらう進め方にしました。

AI Studio移行の全プロセスとGeminiとの激闘

まずは、AI Studioで「hello world」と表示するだけのアプリを作成します。

hello worldアプリができる

その後、[https://github.com/okamoto53515606/firebase-studio-sample1/tree/firebase-studio) のソースをzipにしてAI Studioのfirebase-studio-sample1フォルダにアップロード。開発Geminiとのチャットを開始しました。ここからは私の指示(プロンプト)を中心に、ありのままのやりとりを掲載します。

(02) okamo: firebase-studio-sample1フォルダ内のソースを参考に、分析アプリを作れますか? mcp-server-ga4は使わないように実装してほしいです。回答は日本語でお願いします。

ここに以下の内容(ga4のmcpを使わずに独自ツールとして実装する例)をはりつけ。 https://github.com/okamoto53515606/firebase-studio-sample1/blob/main/docs/gemini-prompt-remove-mcp.md (補足)「ラッパーツールを書くなら MCP を経由する意味が薄い」という結論に至りました。このプロンプトでは、MCP 依存を完全に削除し、@google-analytics/data ライブラリを使って直接 API を叩く構成に書き換えます・ もともとはfirebase studioで実装したものだから、要件みたせば、実装方法の詳細はまかせます。あなたがやりやすいように。

これを受けてシークレット設定画面が出たので設定。

シークレットを設定

(04) okamo: ありがとう。シークレットは設定しました。 モデルがgemini15Flashになっているので、gemini-3.1-pro-previewにして、 それと、不要ファイルやフォルダは削除してほしいです。 ありがとう。srcフォルダは不要じゃないかな?使ってますかね? あなたには見えないのかな?私からみると、pckage.jsonのある場所にsrcフォルダがあります。

(05) okamo: 消えてないので、私の方でsrcフォルダごと削除しました。 metadata.jsonは以下にしてほしいです。 "name": "firebase-studio-sample1", "description": "これは解説用のサンプルアプリです。", それとプレビューで見た目の装飾がついてないです。

(06) okamo: プロンプトでanalytics data apiとBigqueryのつかいわけの言及はありますか? gemini pro 3ならいわなくてもわかるかな?

ここでモデルのAPI制限によるエラーが発生。無料枠のAPIキーが自動セットされていたため、Tier 3 のGemini APIキーに変更しました。

(09) okamo: いったん、CloudRunのサービスアカウントで GCPのAPIを呼び出せることを確認したい(IAM許可設定もして)ので、まずデプロイしてみるから、 analytics api や bigquery api でえらーになったとき、画面に詳細エラーだすようにしておいてほしい。 (サンプルアプリなので、全体てきに画面に詳細エラーがでたほうがいいし、agentとのやりとりの詳細もわかったほうがうれしい)

(10) okamo: ありがとう。入力欄は3行ぐらいの高さにして、改行入力しても送信しないようにして、ボタンでのみ送信にしてほしいです。

(11) okamo: モデル名はpreviewない方がいいかも。変更できる? gemini-3.1-pro(標準的な安定版)gemini-3.1-pro-preview(最新機能をテストできるプレビュー版)

(12) okamo: スマホでみたときに表示領域がへるので、固定のヘッダーの高さは極力低くしてほしい(説明も不要でです)フッターの説明も不要。

(13) okamo: ごめん。モデル名はgoogleai/gemini-3.1-pro-previewが正しかった。googleai/gemini-3.1-proだと以下404エラー。(エラー詳細省略)

デプロイ時のビルドエラーとまさかの「ソース全消失」

Publishボタンを押すとエラー。Cloud Runまで到達していないためビルドエラーを疑いました。

(14) okamo: publishボタンでエラー。cloudrunまでいってないから、ビルドエラーだと思う。 ビルドエラーになりそうな箇所チェックしてみて。たとえば、たしか、 output: 'standalone', 必要だよね。nextをcloudrunでうごかすのに。 それと"next": "15.5.10",に変更してほしい。(15系の最新に)

Next.jsのバージョン不整合(package.jsonpackage-lock.json)があり、直そうとしたところ、なんとコードエディタに何も表示されず、プレビューもできなくなりました。 Geminiからは「おそらくAI Studio環境の不具合、または何らかの操作によって、プロジェクト内のすべてのファイルが完全に削除されてしまった状態です」との回答。 手動で「Restore」ボタンから直近のリストアpointに戻しました。

デプロイ成功と権限・ツールの不具合調整

なんとかPublishに成功。次にGCPコンソールでCloud Runのサービスアカウント(Compute Engine デフォルトサービスアカウント)にBigQueryの権限(データ閲覧者、ジョブユーザー)を追加しました。

Cloud Runのサービスアカウント権限追加

GA4側の権限設定は過去の記事 【解決策】GA4でサービスアカウントが追加できないエラーの回避手順(「Googleアカウントと一致しません」) に従い、OAuth 2.0 Playgroundから追加しました。また、Cloud RunのプロジェクトでGoogle Analytics Data APIとBigQuery APIを有効化しています。

さらに、【AI Studio豆知識】Cloud RunのWebアプリをIAP(Googleログイン)で安全に保護する方法 に従い、Googleログインも設定してアプリを動かしたところ、Function callingに関するエラー(thought_signature関連)が発生しました。

Geminiは「モデルをgemini-2.5-proに下げて」と提案してきましたが、これには納得いかず。

(22) okamo: モデルを下げるのでなく、モデルに対応したコードをかくべきでは? 以下URL(gemini3でカスタムツール使うgoogle公式チュートリアル)みれますか? https://ai.google.dev/gemini-api/docs/gemini-3?hl=ja#structured_outputs_with_tools https://ai.google.dev/gemini-api/docs/tool-combination?hl=ja Next.js 15 は安定板ですよ。

URLを渡すと、Geminiは「最新の @google/genai の仕様に合わせて修正を行うのが正しいアプローチでした」と方針を修正。AI StudioのGemini自体が最新仕様を知らないのは驚きでした。

その後も、デプロイ時に古い環境変数(GOOGLE_APPLICATION_CREDENTIALS)が残るバグに遭遇。

(30) okamo: いやだから、、以下は実施済だから、不具合でないの??っていってるのですね。 一覧の中に GOOGLE_APPLICATION_CREDENTIALS や GCP_CREDENTIALS_JSON が残っている場合は、ゴミ箱アイコン等を押して手動で削除

AI StudioのUIから消してもCloud RunのYAMLに残り続けるという同期不具合と判明し、Cloud RunのYAMLを直接編集し、GOOGLE_APPLICATION_CREDENTIALSの設定を削除しました。

アプリケーションの稼働確認

数々のトラブルを乗り越え、ついに正常に動作しました。(翌朝AM6時ぐらい) スマホから手軽にGA4の状況をチェックできるようになりました。連携先(GA4やBigQuery)とCloud Runが共にGoogleエコシステム内なので、キーレス(鍵無し)でセキュアに連携できるのは強みです。

GA4とBigQuery連携の確認

さらに、途中でGoogle検索を利用するツール呼び出しのコードも見せたため、勝手にGoogle検索機能も組み込んでくれました。

Google検索機能の動作確認

今回作成したソースコードと、GeminiとのやりとりはすべてGitHubで公開しています。

重大な点:開発コストについて

土曜夜から日曜朝にかけてAI Studioでエラー対応を回し続けたところ、Gemini APIの利用金額がこの日だけで 1.84K(約1,840円) に達していました。

API利用料金

エラーだらけで長時間になり、いつの間にか多額の課金がされているのは精神的に辛いものがあります。「まだCopilot Pro+の月額39ドルの方が安く感じる…」というのが本音です。 ただ、Strands Agentsで作っているようなアプリをAI Studioで実現できるかという検証のために身銭を切った形になり、自身が納得するためにも十分支払う価値はあったと考えています。

今回の所感と「homepage-v2」方針への自信

今回、もう少しスムーズにいくと予想していましたが、想像以上に時間がかかりました。 私の感覚では、「VS Code + GitHub Copilot (Claude Agent)」の組み合わせの方が断然スムーズです。実装完了からデプロイ・動作確認OKまでの所要時間に、実に4倍以上の差があるイメージです。

ネットの情報ではAI Studioで簡単にアプリができる印象を受けますが、プロダクトの宣伝と実態にはまだまだ大きな乖離があるように感じます。エラー原因の特定やバージョン不整合、謎のソース消失など、非エンジニアの方がAI Studioでアプリを作って修正・デプロイするには、壁がかなり高いというのが正直な印象です。

一時期は「homepage-v2のAI Studio版なんかどうかなぁ」と考えたこともありましたが、今回実際に体験したことで、現在の homepage-v2の方針(インストーラー+WSLを配布し、VS Code + GitHub Copilot / Claude で修正する)で正解だったと改めて感じ、自信を持つことができました(自画自賛です)。

今後は、SearchConsoleのデータをBigQueryにエクスポートし、このアプリで解析する試みや、エージェントにコードインタラプターを提供してdanfojsによる分析やグラフ作成などもできるように拡張してみたいと考えています。(※要は okamoちゃんねる のような Strands Agents で実装しているようなAIエージェントアプリ を AI Studioでどの程度できるのか を検証してみたい)

おまけ: okamoちゃんねるのレビュー

  • クロード(辛口エンジニア) 「Geminiにムキになってるやり取りは最高だった。ただ、package.jsonの不要な依存や型安全性を無視した outputSchema: z.any() を放置したままなのはエンジニアとして感心しないな。サンプルだからって甘えるなよ。」
  • GPT(税理士) 「1日1,840円のコスト開示は経営判断として素晴らしい。ですがREADMEや手順書が不十分で、これでは非エンジニアの事業者が再現できません。okamoさん、これって本当に『誰のため』に書いたんですか?」
  • Gemini(お母さん) 「土曜の夜から朝まで、消えちゃうコードと一人で戦ってたなんて涙が出ちゃう!でもね、今回は誰かを助けたい優しさより、okamoさんの『意地』や『AIへの対抗心』がちょっと前に出ちゃってた気がするわ!」

▼ AI 仮想読者3名による辛口レビュー(BBS風)はこちら