ZhgChg.Li

AI AgentでGoogle Apps Script開発を効率化|ゼロから始めずに自動化を実現

プログラミング初心者も安心。AI AgentがGoogle Apps Scriptの連携・開発をサポートし、手間を大幅削減。Claude Design & Claude Codeで自分だけのダッシュボードを簡単作成し、作業効率アップを実感しよう。

AI AgentでGoogle Apps Script開発を効率化|ゼロから始めずに自動化を実現
本記事は AI による翻訳です。お気づきの点があればお知らせください。

ゼロから始めるのはもうやめよう AIが直接Google Apps Scriptの連携と開発を代行します

AIで無駄を宝に変える — Claude Design & Claude Codeを使ってあなた専用のパーソナルデスクトップダッシュボードを作る例。

完成品デモ

長年引き出しに眠っていたiPhone 8 Plusが、完全にカスタマイズ可能で無料の個人用デスクトップダッシュボードに生まれ変わりました。

はじめに

TL;DR あなたがAIを使って自分だけのパーソナルデスクトップダッシュボードを作る方法にだけ興味があるなら、この章は飛ばしてください。

大体的に2021年頃からGoogle Apps Scriptを使って、小さなツールを開発し、自動化でワークフローを最適化してきました。その当時はAIもなく、RPAによる自動化もほとんど話題になっていませんでした。ただ単純にチームの協力効率を上げたり、個人の生活の快適さを向上させたりしたかっただけで、すべてのスクリプトは自分で一行一行手書きしていました(今から見ると昔ながらのプログラミングです)。しかし、一番難しいのはプログラミングそのものではなく、どうやって連携するか?どうやって連携すればいいのか?思考をどう枠から抜け出すか?ということでした。

以前に行った事例

  1. 目標 — 外部公開のメール窓口で受信したメールを Slack の作業チャンネルに転送したい。
    技術的に Google Apps Script は Gmail 受信時のイベントを持っていないため、別の方法としてスケジュール機能を使い、毎分(またはそれ以上の間隔)に実行:未読メールをチェック ➡️ 内容を読み取り ➡️ HTMLを除去して Slack に転送 ➡️ 既読にする。
    特定のメール(送信者や件名内容)だけを対象にしたい場合は、Gmailでラベルフィルターを設定し、未読メールのチェックを未読+ラベルに変更すれば実現可能。
    ref: 「 運用 Google Apps Script で Gmail メールを Slack に転送

  2. 目標 — GAのトラフィックやCrash-free rateを自動でSlackの作業チャンネルに送信する。
    Google Apps ScriptにはAnalyticsDataやAdSenseのライブラリが標準で用意されており、パラメータを設定するだけでほぼ無痛で統合できます。
    アプリでクラッシュの詳細やTop 10のIssueを調べたい場合は、さらにFirebaseからBigQueryへデータを連携し、Google Apps ScriptでBigQueryライブラリを読み込み、SQLクエリを実行すれば可能です。
    ref: 「 Crashlytics + Google Analytics 自動查詢 App Crash-Free Users Rate 」、「 Crashlytics + Big Query 打造更即時便利的 Crash 追蹤工具

  3. 目標 — 自動で運営データを Google Sheet に集約する。
    前述の方法に加え、チームのテレビウォールで運営データを一目で確認できるように Web App を作成しました。当時の技術的な問題は、一部のデータが社内ネットワークにあり、外部ネットからアクセスできなかったことです。幸いにも、逆に社内ネットワーク側でスケジュールを組み、毎日データを Google Apps Script の Web App に送信し、受信後に処理して Google Sheet に反映させました。
    ref:「 使用 Google Apps Script 實現每日數據報表 RPA 自動化

  4. 目標 — 既存のリソースで簡単なアプリパッケージングプラットフォームを構築する
    当時の背景は、アプリのパッケージングサービスがGitHub Actionsに移行したことですが、非エンジニアチームもアプリのパッケージングが必要で、以前は手作業で対応していました。そこで、社内チーム全員が使えるサービスとしてGitHub Actionsを連携してパッケージングを実行する仕組みが求められました。
    Google Apps ScriptのWebアプリをプラットフォームとして使用し、組織内のアカウントのみ利用可能に制限。フォームにパッケージング情報を入力するとGitHub Actions(GitHub API)をトリガーし、パッケージング完了のSlack通知を送信します。
    パッケージングしたアプリはFirebase App Distributionにアップロードしますが、Google Apps Scriptには組み込みのライブラリはありません。しかし調べたところ googleapis を直接使えることがわかり、最終的には問題なく連携できました。
    ref:「 Google Apps Script Web AppでGitHub Actionsを連携し、無料で使いやすいパッケージングツールプラットフォームを構築する

まだ小さな事例は挙げませんが、とにかく伝えたいのは「方法は困難より多い」ということです。実際にプログラムを書くこと自体は一番簡単で、いかに多くの障害を乗り越えて連携させるかが難しいのです

技術的な制限

「方法は困難より多い」という前提は、技術的に可能で合理的であることです。言い換えれば、「方向が間違っていれば、努力しても無駄」です。実際にプログラムを書かなくても、Google Apps Scriptを使ってツールを開発するタイミングを「選択」できることを必ず知っておくべきです。

  • User-Agent をカスタマイズできない: セキュリティと悪用防止のため、Google Apps Script の User-Agent は指定できません。(ただし他の Header フィールドは指定可能です)
    影響: 一部の特殊な API サービスでは User-Agent にデータを含める必要があったり、対象のサイトや API が Google Apps Script の User-Agent をブロックしている場合があります。これらは厳しい制限であり、使用できません。
    回避策: どうしても使いたい場合は Cloudflare Worker を使って Proxy 経由で接続する方法があります。

  • 最長実行時間 6分: 1回の実行は最大6分までで、処理が大きすぎる場合は分割することを推奨します。
    また、トリガーの合計実行時間にも上限があり、1日あたり最大90分まで実行可能です。(ただし、これはソフトリミットのようで、私のスクリプトは多くが上限を超えていますが、ブロックされていません)

  • 単一実行は同期ブロッキングが基本 :単一の実行内で複数のスレッドを並行処理することはできません。処理に時間がかかる場合や大量の並行処理が必要な場合は、複数回に分けて実行し、スケジュールでトリガーすることを推奨します。

  • コールドスタート: Faasサービスの共通の問題で、タスクが長時間トリガーされないとスリープ状態になり、再度トリガーされる際に待機時間が長くなることがあります。
    この問題に加え、タスクが同期(ブロッキング)実行である制限があるため、Webhookとして他のサービスから呼び出すとリクエスト失敗と判断されやすく、リクエストの重複送信や重複受信、重複実行が起こる可能性があります。
    例えば、SlackはWebhookサーバーが3秒以内に応答することを厳しく要求しており、過去の経験ではこの問題に頻繁に直面しました。

  • Web App API はリダイレクトします: セキュリティ上の理由から、Content service が返す内容は一度使い切りの script.googleusercontent.com URL にリダイレクトされます。HTTP クライアントはリダイレクトのフォローに対応している必要があります。
    一部のWebhookサービスは自動で302リダイレクトしないと失敗します(例:Jira Webhook)。

  • Web App HTML :ウェブページの上部に不正利用防止の声明があり、本当のRWD(レスポンシブデザイン)は実現できません(ページは実際にはGoogleのフレーム内のiframeです)。URLが見栄えが悪くカスタマイズできず、PWAの全画面表示もできません。

  • サービス制限: 一部のサービスには利用制限がありますが、通常の使用では上限に達することはほとんどありません。ただし、高頻度でリアルタイムのチェックや応答が必要な場合は、制限に引っかかりやすくなります。

<https://developers.google.com/apps-script/guides/services/quotas?hl=zh-tw>

https://developers.google.com/apps-script/guides/services/quotas?hl=zh-tw

優位性と機能

制限を理解した上で、どのような利点や機能があるか見てみましょう。

最大の利点は、Google純正の関連サービスと直接シームレスに連携できることです。Webアプリのアクセス権は、スクリプト所有者本人、組織内のメンバー、Googleにログインしているアカウント、全員から選択可能で、複雑なOAuthの手続きを自分で行う必要がなく、ワンクリックで設定・完了・実行が可能です:

組み込みサービス Built-in Services: GASサービスで参照しなくても使用可能。

  • DocumentApp → Google ドキュメント

  • SpreadsheetApp → Google スプレッドシート

  • SlidesApp → Google スライド

  • FormApp → Google フォーム

  • GmailApp → Gmail

  • CalendarApp → Google カレンダー

  • DriveApp → Google ドライブ

  • SitesApp → Google サイト

  • Maps → マップ / 距離 / ルート

  • 翻訳

高度なサービス Advanced Services: GASサービスで参照を追加する必要があります。

  • Sheets API

  • Drive API

  • Calendar API

  • Gmail API

  • Analytics API / Analytics Data API

  • BigQuery API

  • Adsense API

  • YouTube Data API

  • Tasks API

  • Googleapis(その他/GCP)

ツール / システムサービス:

  • UrlFetchApp → 外部APIを呼び出す

  • PropertiesService → キー・バリューの保存

  • CacheService → キャッシュ

  • LockService → 同時実行制御

  • Utilities → 日付 / ハッシュ / Base64

  • Logger → ログ出力

  • HtmlService → Web UIを作成し、Ajax非同期でコンテンツを更新することをサポートする

  • ContentService → APIエンドポイントの作成

  • Trigger → トリガーによる自動実行

基本的に開発に必要なものはすべて揃っています。実務ではこれらのサービスを組み合わせて連携させることで、ワークフローの自動化が実現できます。例えば:

  • 自動で GA トラフィック/Crash-free rate を Slack 作業チャンネルに送信:
    Analytics Data API でデータ取得、PropertiesService で Slack Bot トークンを保存、UrlFetchApp で Slack Send Message API を呼び出し

  • 自動で運営データを Google Sheet とデータ Dashboard Web に集約:
    Trigger でスケジュール実行する関数、LockService で自分だけが実行していることを保証、Analytics Data API でデータ取得、UrlFetchApp で外部サービスのデータ取得、SpreadsheetApp で Google Sheet に書き込み、HtmlService で Web アプリのインターフェースを出力、ContentService で JSON データを出力+CacheService でデータキャッシュ

Cloud Function / Lambda のようなFAASとの違い

Google Apps Script は Google サービスを中心とした FAAS スクリプトツールと見なせます。制限は多いですが、現在は完全無料で、Google サービスとスムーズに連携できます; 他の FAAS サービスは通常有料で、一部無料枠がありますが、Google サービスとの連携には正式な IAM や OAuth フローが必要で、やや複雑です。

不適切なシーン

  • Googleファミリー以外、例えばMicrosoft OfficeやOneNoteと連携したい場合…

  • オンプレミスとクラウドのハイブリッド環境には、n8nやAIエージェントがより適しています。

  • 複雑な計算や大量のデータ処理では、各実行セッションが最大6分で終了しないことがあります。

  • 大規模なウェブサイトのクロールやチケット争奪プログラムは避けた方がいいです。Google Apps Scriptは簡単にブロックされたり、Cloudflareのアンチスクレイピングに阻まれたりします。

適したシーン

個人やチーム内のワークフロー連携について、私の場合は日常のルーチン作業を管理するために多くのスクリプトを使っています。例えば、毎日 zhgchg.li のサイトトラフィック概要を通知したり、GitHubリポジトリのIssuesを管理したり、保有株のGoogle Sheets上の現在価格を更新したりしています。チームの場合は、アプリのリリースプロセスをGoogleカレンダーと連携させ、カレンダーイベントをチェックして対応するCI/CDプロセス(GitHub Actionsの呼び出し)をトリガーし、チームのSlackチャンネルにメッセージを送信したり、アプリ審査失敗のメールをSlackに転送したりしています。

以上は人間の視点でここ数年のGoogle Apps Script開発の感想を振り返ったもので、次に最近使い始めたAIエージェントに0から直接GASを開発してもらった実感と実例—個人用デスクトップDashboard Deckについてです。

AIエージェントにGoogle Apps Scriptの連携と開発を直接任せる

最近、0からAIを使って直接Google Apps Scriptを開発することを試み始めました。上記の基礎知識と組み合わせて(知識がなくてもAIの理解度は非常に高いです)、完成度と正確性はほぼ100%です。「ゼロからAIがプログラムを書く」時代は終わったと言えるでしょう。

実践 — AIで廃棄物を宝に — Claude Design & Claude Codeを使ってあなた専用の個人デスクトップダッシュボードを作成する

問題

ずっと引き出しにしまって使っていなかったiPhone 8 Plus(iOS 16.7)を、デスクトップの小さな画面として使い、見たいリアルタイム情報を表示できるダッシュボードにしようと思いました。

基礎インフラ

AIエージェントにGoogle Apps Scriptの開発を手伝ってもらうためには、いくつかの基本的なインフラを整える必要があります。

AI開発でなくても、中〜大規模のスクリプト開発時には必ず使用することを強くおすすめします。Webエディタは時々クラッシュしたり、誤って複数のタブを開いて古いコードが新しいコードを上書きすることがあります。Claspを使うと、より便利で安全にソースコードの管理・作成ができます。

その他の使用例: Google Apps Script プロジェクトを同時に Git リポジトリにアップロードしてバージョン管理(.clasprc.json.clasp.json を除外)、CI で Jest JS の単体テストを自動実行、CD で Clasp トークンを使って最新コードを取得、.claspignore で Google Apps Script プロジェクトにアップロードしないファイルを除外可能。

  1. インストール clasp Google Apps Script CLI ( 公式 ローカル開発キット)
  1. clasp login を実行してログインし、認証トークンを生成する(Google Apps Script に対応するアカウントを選択

  2. clasprc(Claspトークン)をKeychainに保存してAIエージェントが安全に呼び出せるようにする

security add-generic-password \
  -U \
  -s "com.google.clasp" \
  -a "$USER" \
  -w "$(cat ~/.clasprc.json)"

これはパスワードをキーチェーンに追加するコマンドです

もし Clasp トークンをコピーして CI/CD の Secret に設定してタスクを実行したい場合は、cat ~/.clasprc.json \\| base64 \\| pbcopy(base64 エンコードを忘れずに)を使います。使用時は echo "$CLASPRC" \\| base64 --decode > ~/.clasprc.json && chmod 600 ~/.clasprc.json とします。

  1. プロジェクトディレクトリの作成

プロジェクトディレクトリを作成してから移動する必要があります。

  1. ディレクトリ内に Google Apps Script プロジェクトを作成する(clasp を使用)
clasp create

ディレクトリ名をそのままプロジェクト名として使用します。

現在のプロジェクトは空で、appsscript.json という設定ファイルだけがあります。

私のデザイン

もしTokenを節約したい場合は、私のGAS Web Appを直接git cloneして、私のデザインや開発済みのGASコードを再利用できます。

Claude Design または Design Agent Skill を使ってダッシュボードを設計する

方式 1 — Claude Design
前回の記事「 Jekyll Blog カスタムテーマ設計|Claude Design + Claude Code で専用スタイルを素早く作成 」で紹介したように、同じ手順で満足いくデザインに調整し、Project をエクスポートして解凍後、プロジェクトの ./Design フォルダに配置します。

方式 2 — Design Agent Skill
サードパーティの設計 Skillを使ってデザインを完成させます。私のプロンプトはおおよそ以下の通りです:

/huashu-design
iPhone 8 Plus の横向き表示に対応したウェブダッシュボードを設計し、デザイン結果を ./Design フォルダに保存する
- 後で Google Apps Script Web App にデプロイ予定
- 上部には日付と曜日、ページ切替時の時計を固定表示
- 下部のタブは定期的に切り替わり、進行状況バーを表示
- 下部タブの内容:
-- 天気情報
-- カレンダー:現在の予定または当日の直近の予定、残りのイベントを表示
-- カウントダウン/カウントアップ日数

私は Model: Opus 4.7 (1M コンテキスト) / 努力度: 中程度 を使用しています


⏺ まず状況を把握しました:iPhone 8 Plus 横向き = 736×414 CSS px、内容データ構造(天気 / カレンダー / カウントダウン)は CLAUDE.md に明確に定義済みです。
  スタイルはまだ指定されていませんので、「デザイン方向アドバイザー」として3つの明確に異なる流派の方向性を提示します。どれか一つ(または混ぜても可、例:"Aのフォント + Cの配色")を選んでください。そこから完全なハイファイを作成します。
  ---
  🅐 方向一 · Massimo Vignelli 式スイスグリッド(情報建築派)
  ▎ Vignelliがニューヨーク地下鉄のために設計したグリッド美学——Helvetica + 厳格なカラム + 赤黒白の三色。情報自体が装飾であり、イラストやアイコン、グラデーションに頼らない。
  - フォント:Neue Haas Grotesk / Inter Tight(ディスプレイ)+ IBM Plex Mono(時計/数字)
  - 配色:純白背景 #FAFAFA · 純黒インク #0A0A0A · 単一朱赤アクセント #E63946(進捗バーと現在タブに使用)
  - レイアウト:12カラムベースライングリッドで全要素を揃える;ページめくり時計は黒背景白文字の大文字 + 細い水平分割線;タブは角なしのカラーブロック
  - 雰囲気キーワード:理性的 / 控えめ / 印刷物 / 情報密度 / 永遠
  - 適用例:時代を超えた高品質新聞の一面のようなダッシュボードが欲しい場合
  ---
  🅑 方向二 · Dieter Rams × Braun 工業計器(ミニマル産業派)
  ▎ RamsがBraunのためにデザインしたET66電卓、オーディオシステムの美学——淡い米灰色背景 + 角丸ハードウェアパネル + 単一オレンジアクセント +
  ▎ 物理ボタンの質感。各ブロックは独立した計器パネルのよう。
  - フォント:Söhne / Inter(ラベル)+ JetBrains Mono(時計はLCD7セグ風)
  - 配色:暖かい米灰色 #E5E1DA · 深炭色 #2B2B2B · Braunオレンジ #E85D2Cアクセント · ページめくり時計はLCD黄緑 #A8B547のヴィンテージ液晶風
  - レイアウト:各カードに微かな内陰影と1pxのヘアライン枠線を持ち、実物計器の凹み感;タブ切替はボタンの沈み込みのよう
  - 雰囲気キーワード:工業デザイン / 触感 / 1970年代Braun / 落ち着き / エンジニア美学
  - 適用例:ハードウェア感が好きで長時間見ても疲れないものが欲しい場合
  ---
  🅒 方向三 · Teenage Engineering OP-1 / ターミナル(スポーツ詩学派)
  ▎ TEのOP-1シンセサイザーパネルと古いOLED端末美学——深い炭灰色背景 + OLED青緑のグロー + モノスペースフォント + 細かいグリッド背景。ページめくり時計は大型OLED風
  ▎ ページめくり、進捗バーはシーケンサーのステップライトのよう。
  - フォント:JetBrains Mono / IBM Plex Mono(全体)+ Berkeley Mono(大文字ディスプレイ)
  - 配色:背景 #0E0F0D · 主要テキスト #E8E5DA 米白 · OLED青 #9DEF8Fアクセント · 警告オレンジ #FFB454
  - レイアウト:背景に極薄の8pxドットグリッド;ページめくり時計大文字は幅の1/3を占め、わずかな走査線入り;タブ進捗バーはLEDステップ風;天気はASCII風小アイコン
  - 雰囲気キーワード:OLED / サイバーデッキ / アナログシンセ / ハッカーシック / ハッカー文化
  - 適用例:机上で「ウェブページ」ではなく「機器」として見せたい場合
  ---
  どれを選ぶか(またはどの要素を混ぜるか)教えてください。続けて完全なハイファイを ./Design/ に作成します。 また「どれも違うから他の案を」と言ってもらえれば別の流派を提案します。

好きなスタイルを選ぶか、AIに自分の希望するスタイルを伝えることもできます。例えば「紙の質感風、アイボリーの和紙+朱印の美学」など。

AIの設計完了を待っています… AIは完了後にPlaywrightでスクリーンショットを撮って検証することがあります。トークンを節約したい場合や自分で結果を確認したい場合は、プロンプトにその旨を伝えてください。

目次で直接 .html ファイルをクリックしてデザイン結果を確認:

満足するまで調整してから次の開発に進む。

カウントダウン日データソース Google Sheet を作成:

最後に、カウントダウンの日付データ用の Google Sheet を作成しておきます。今後データを追加する際は、このシートに追加するだけで済みます。

title,date,repeat
誕生日,1994-07-18,yes
日本旅行,2026-12-12,

repeat=yes: 毎年繰り返されるイベント

Sheet Idをメモする:上の画像のURLの赤い部分 / Gid: 0(最初のシート)

交通部中央気象局 API キーの登録:

Claude Codeを使ったダッシュボード開発実現

まずは Claude Code メモリの初期化 Markdown:

/init
⏺ CLAUDE.md を作成し、本リポジトリの現状に焦点を当てています:
  - プロジェクト段階:初期の GAS プロジェクトで、現在は appsscript.json / .clasp.json / Design/Paper Dashboard.html のみで、.gs のコードはまだありません。
  - ファイル用途:manifest 設定(V8、America/New_York、Stackdriver)、clasp による scriptId の紐付け、React+CDN を使った純粋な視覚プロトタイプ(google.script.run は含まれません)。
  - よく使うコマンド:主に clasp(push / pull / open / logs / deploy)、現在は lint や test runner はありません。
  - push 前の注意点:skipSubdirectories: false にすると Design/Paper Dashboard.html も一緒にアップロードされます;manifest に oauthScopes はまだ宣言されていません;タイムゾーン設定の位置。
  - 作業範囲:本リポジトリの内容のみ使用し、他のプロジェクトは参照しないことを明確に要求(あなたの memory ルールに対応)

実行プランの開発作業計画:

/plan
./Design のダッシュボードウェブ機能とデザインを実現し、Google Apps Script Web App にデプロイする。
- 天気は交通部中央気象署のAPI https://opendata.cwa.gov.tw/api/v1/rest/datastore/F-C0032-00 を使用
- 台北市の天気を表示し、ある項目はすべて表示する
- 開発段階では自分でトークンを生成し、Web App をデプロイして必要なメソッドを自主的にトリガーしテスト検証できる。開発完了後は必ずこの入口を削除すること
- Web App は全員アクセス可能にデプロイするが、カスタムトークンで保護し、初回使用時はユーザーがトークンを入力するかURLから渡す
- カレンダーはデフォルトで primary を読み取る
- カウントダウン日は提供された Google Sheet から title, date, repeat を読み取る。repeat が yes の場合は年単位の繰り返しカウントダウンで、経過した年と月も表示(切り捨て)
- APIキー、Google Sheet ID/GID などはすべて PropertiesService に設定する
- clasp push & deploy を直接使用し、clasprc のログイントークンは keychain security add-generic-password \ -U \ -s "com.google.clasp" \ -a "$USER" で登録する
- 手動で対応が必要な箇所はすべて繁体字中国語で手順を教えてほしい
- oauthScopes": [ "https://www.googleapis.com/auth/script.external_request", "https://www.googleapis.com/auth/calendar", "https://www.googleapis.com/auth/spreadsheets", "https://www.googleapis.com/auth/script.scriptapp" ]
- google.script.run の連携利用フォーマットが正しいか特に確認する
- ライブの GAS Web App HTML は iframe ラッパー内でレンダリングされる
- ./Design など Google Apps Script にアップロード不要のファイルは .claspignore に追加する
  • Web App には4つのアクセス権限があります:全員、本人のみ、ログインユーザーのみ、ログイン&組織内のアカウントのみ

  • 上記の例の設計はシンプルで、誰でもアクセス可能ですが、正しいランダムなトークンを入力しないとデータを閲覧できません。天気は自分の地域に変更でき、複数の地域も設定可能です。

  • カレンダーはデフォルトでメインカレンダーのみを処理します。他のカレンダーがある場合は、カレンダーの設定と共有 -> カレンダーの統合 -> カレンダーIDから取得できます。

  • ここに手間を省く開発方法を追加し、AIにテスト用Webアプリの入口を直接デプロイさせて、開発しながらテストと修正を行い、完成したら私に知らせてもらう

Planが完了して問題がなければAIに質問し、問題なければ実装を開始できます!

コーヒーを淹れながらAI開発を待つ…

AIエージェントの質問:

  あなたに必要な操作一度だけ:

  1. エディタを開く: https://script.google.com/d/1KEWgIql-gqTNI_Tv_w2-5t7VE_R0eBtjAtd3iqLqabYLOnzJZ8Ga8N4s/edit
  2. 右上の部署 / Deploy」→「管理部署作業 / Manage deployments
  3. 既存の両方のデプロイ@HEAD  dev v1  鉛筆アイコンの編集ではアクセス権の変更不可を削除
  4. その後、「新增部署 / New deployment」→ 種類: ウェブアプリ  実行者: 自分あなたのアカウント)→ 誰がアクセス可能か: だれでも / Anyone  デプロイ
  5. 同意画面でOAuthを許可calendar.readonly, spreadsheets.readonly, external_request
  6. 新しいウェブアプリのURLhttps://script.google.com/macros/s/AKfycb.../exec のようなもの)をコピーしてここに貼り付ける

  また以下も貼り付けてください:
  - CWA APIキー交通部中央気象署 Open Data Authorization
  - 倒數日シートIDSheet URLの /d/  /edit の間の長い部分
  - シートGIDURLの gid= の後の数字  最初のタブはデフォルトで0

  URLと秘密情報を受け取ったらdevエンドポイント経由でPropertiesをセットしアクセストークンを発行し各ハンドラーを確認して接続します

(1.) 初回実行時は認証が必要で、その後はAIエージェントが自動で実行できます。Script EditorのURLへアクセスしてください:

適当な関数があるファイルを選び、デバッグしたい関数を選択してください:

  • 初回実行時または権限を追加した場合にのみ認証が必要です。

もしAIがずっと権限の問題を言っているのに、実際の実行で認証ウィンドウが表示されない場合は、プロジェクト設定で「エディタに『appsscript.json』マニフェストファイルを表示する」をチェックし、エディタに戻って appsscript.jsonoauthScopes の内容を少し変更して一度実行し、再び元に戻して実行すると認証プロセスが表示されるはずです。

1だけ自分で処理すれば、あとはAIに任せられる:

1. OK、直接デプロイしてください
  CWA API Key: CWA-XXXX-XXXX-XXXX-XXXX-XXXX
  カウントダウン日 Sheet ID: XXXX / GID: 0

AIによるGoogle Apps Scriptの設定支援..

 スコープが更新されてプッシュされましたがデプロイヤーのOAuth許可を新しいスコープに対して再認証する必要がありますウェブアプリはあなたのアカウントで実行されます  新たに追加されたスコープは再許可が必要です

  これを一度行ってください

  1. エディタを開くhttps://script.google.com/d/1KEWgIql-gqTNI_Tv_w2-5t7VE_R0eBtjAtd3iqLqabYLOnzJZ8Ga8N4s/edit
  2. 上部の関数ドロップダウンから setupConfigまたは任意の関数を選択
  3. 執行 / Runをクリック  Googleが需要授權 / Authorization requiredダイアログを表示します
  4. 許可  アップグレードされたauth/spreadsheetsスコープを付与
  5. 完了したら教えてくださいカウントダウンハンドラを再テストします

私たちはAIと約束していても、時には手動で助けが必要な部分が出てくることがあります。例えば上記のメッセージのように。私たちは単純に彼の指示通りに関数を一度実行して「OK」と伝えるだけでいいのです。ちょっとした手助けと思ってください。(もし彼の言った方法が表示されなければ、ページをリロードしてください)

AI 開発完了、検収!

問題があれば、AIに修正を依頼してください。

AIで作るあなただけのパーソナルデスクトップダッシュボード — 成果

デスクトップ版

iPhone モバイル版

GASのWebアプリではフルスクリーンのPWAとしてURLバーを隠すことはできません。100%の体験を求める場合は、上級内容を参照してください。

最終コード

今後のタスク

  • [required] AIに伝える:開発完了後、すべての開発段階のインターフェース/エンドポイントを削除してください

  • [optional] Google Apps Script プロジェクト -> プロジェクト設定 -> スクリプトプロパティ -> ACCESS_TOKEN -> 新しいランダム文字列を生成し、URLの ?token= もこの文字列に変更する
    macOS では以下のコマンドでランダム文字列を生成できます: openssl rand -hex 32

  • [optional] 交通部中央気象局APIキーの再発行 を行い、Google Apps Script プロジェクト -> プロジェクト設定 -> スクリプトのプロパティ -> CWA_API_KEY に入力してください。

⚠️Claude Codeの警告によると: 会話内容に露出したすべてのトークンは漏洩したとみなす必要がありますが、開発の便宜上、検証のために一時的に直接入力しています。検証が完了したら、新しいトークンを生成して差し替えてください。

もしGASに慣れているなら、最初にスクリプトプロパティを設定しておき、AIにそのまま使うよう指示しても良いです。

拡張

もしこの記事があなたの創造力を刺激したなら、例えばYahoo Financeを連携して注目している株のリアルタイム株価を取得したり、AnalyticsDataやAdSenseを連携してウェブサイトのトラフィックや広告状況を取得したりすることも考えてみてください。

上級

GAS Web App は真のRWDや全画面PWA(アドレスバー非表示)を実現できないため、私はGAS Web AppをAPIサービスとしてJSONデータのみ返すようにし、フロントエンド機能は別途GitHub Pagesで実装して正式なウェブページとしてデプロイしています。これにより、完全な使用体験を得られます。

iOS フルスクリーン PWA 設定 -> Safari でURLを開く -> 共有 -> ホーム画面に追加

iOS フルスクリーン PWA 設定 -> Safari でURLを開く -> 共有 -> ホーム画面に追加

この方法は少し複雑ですが、/plan フェーズでAIにこう伝えることができます:

- GAS Web App はバックエンドサービスのみを行い、JSON をフロントエンドに出力する
- フロントエンドは GitHub Pages を使ってデザイン表示とデプロイを行い、すべてのプログラム開発とデプロイ作業を担当する
- フロントエンドとバックエンド間はカスタム乱数文字列のトークンで保護する

まとめ

以上が今回の AI Agent を使った Google Apps Script 開発体験の紹介です。最近は AI を使って以前開発した中〜大規模の GAS プロジェクトをリファクタリングしており、効果は良好です。さらにローカルで関数の単体テスト(Jest や Google APIs のモックを使用)を追加して安定性を向上させることも可能です(CI/CD 環境で実行し、clasp pull と GAS プロジェクトのバックアップと連携)。AI の GAS に対する理解度と出力の正確性はほぼ 100% に近いです。

もし2021年なら…

もしAIがなかった時代なら、デザインからコーディング、プログラムロジック開発、公開まで手作業で約30時間かかっていたと思います。今ではAIを使えば3時間以内で完了できます。

基本的に今後はもうGASを一から開発することも、AIにゼロからプログラムを書かせることもせず、AIにゼロから製品を作らせるだけです(プログラム?気にしません)。

ケース(2) — 個人株式保有リスト管理

最近試したもう一つのAIによるGoogle Apps Scriptの事例です。私のGoogle Sheetの保有株表を可視化したWebアプリに変換し、Yahoo Financeと連携して最新の株価を取得し表で表示します。下部には売買記録を素早く入力できる欄もあり、入力内容はGoogle Sheetに書き戻されます。

さらなる読書

TL;DR これらは以前に手動で作成したGASサービスとツールです

Post Mediumから変換 by ZMediumToMarkdown.

GitHub で編集
この記事を改善
本記事は Medium で初公開
オリジナルを読む
この記事をシェア
リンクをコピー · SNS でシェア
ZhgChgLi
著者

ZhgChgLi

An iOS, web, and automation developer from Taiwan 🇹🇼 who also loves sharing, traveling, and writing.

コメント