CONTENT
ここから
GAS、スプレッドシート、APIをつなぐ全体像を知る
この教材では、Googleスプレッドシートに入力した内容をもとに、Google Apps ScriptからAI APIを呼び出し、AIの回答をスプレッドシートに表示するところまで作ります。
最初に作るものは、とてもシンプルです。
スプレッドシートにテーマを書く
↓
メニューをクリックする
↓
GASがAI APIに送信する
↓
AIの回答がシートに表示される
Google Apps Scriptは、Google Workspaceを自動化・拡張するためのクラウドベースのJavaScriptプラットフォームです。Google公式でも、Googleプロダクト全体の統合や自動化に使える仕組みとして説明されています。
このページで完成するもの
今回は、次のようなAI自動生成アプリの入口を作ります。
| 項目 | 内容 |
|---|---|
| 画面 | Googleスプレッドシート |
| 処理 | Google Apps Script |
| AI | Gemini API |
| 入力 | 企画テーマ |
| 出力 | AIが考えた企画案 |
| 目標 | ボタン操作でAI回答を出す |
このページでは、まだ画像生成や動画生成はしません。
まずは、スプレッドシートからAIを呼び出せる状態を作ります。
1. 使うサービス
今回使うものは、基本的にGoogleアカウントがあれば始められます。
| 使うもの | 役割 |
|---|---|
| Googleスプレッドシート | 入力画面・結果表示 |
| Google Apps Script | AI APIを呼び出す処理 |
| Google AI Studio | Gemini APIキーを取得 |
| Gemini API | AIに文章を生成してもらう |
Gemini APIを使うにはAPIキーが必要で、Google公式ドキュメントではGoogle AI StudioでAPIキーを作成・管理できると説明されています。
2. 開くURL
まず、次のURLを使います。
Googleスプレッドシート
https://sheets.google.com/
ここで、AIアプリの入力画面を作ります。
Google Apps Script
https://script.google.com/
ただし、今回はスプレッドシートから開く方が簡単です。
スプレッドシート
↓
拡張機能
↓
Apps Script
Google AI Studio APIキー作成画面
https://aistudio.google.com/app/apikey
ここで、Gemini APIのAPIキーを作ります。Google AI StudioのAPIキー画面は、Googleアカウントでログインして利用します。
Gemini API公式ドキュメント
https://ai.google.dev/gemini-api/docs
Gemini APIの公式ドキュメントでは、APIキーを取得して最初のAPI呼び出しを行うクイックスタートが案内されています。
3. 全体像を先に見る
今回作る仕組みは、次のような流れです。
Googleスプレッドシート
入力欄にテーマを書く
↓ 実行
Google Apps Script
入力内容を読み取る
↓ 送信
Gemini API
AIが文章を生成する
↓ 返答
Googleスプレッドシート
結果欄に表示する
難しく見えるかもしれませんが、最初はこの3つだけ覚えれば大丈夫です。
入力する
AIに送る
結果を見る
4. スプレッドシートを作る
まず、Googleスプレッドシートを開きます。
https://sheets.google.com/
新しいスプレッドシートを作成してください。
ファイル名は、次のようにします。
AI企画生成アプリ
5. シートの形を作る
A列とB列に、次のように入力します。
| セル | 入力する内容 |
|---|---|
| A1 | AI企画生成アプリ |
| A3 | 企画テーマ |
| B3 | 放課後に使える学生向けサービス |
| A5 | AIの回答 |
| B5 | ここにAIの回答が入ります |
最初は、B3だけ変えれば使える形にします。
6. Apps Scriptを開く
スプレッドシート上部のメニューから開きます。
拡張機能
↓
Apps Script
Apps Scriptエディタが開いたら、プロジェクト名を変更します。
AI企画生成アプリ
Google公式ドキュメントでは、スプレッドシートに紐づいたApps Scriptからカスタムメニューを作り、メニュー項目をクリックして関数を実行できると説明されています。
7. APIキーを取得する
次に、Gemini APIキーを取得します。
Google AI StudioのAPIキー画面を開きます。
https://aistudio.google.com/app/apikey
手順は次の通りです。
1. Googleアカウントでログインする
2. APIキー作成画面を開く
3. Create API key を押す
4. APIキーをコピーする
5. 他人に見せない場所に保存する
APIキーは、パスワードのように扱います。
人に送らない
SNSに載せない
GitHubに公開しない
スクリーンショットで見せない
8. APIキーをApps Scriptに保存する
APIキーをコードに直接書くのは避けます。
Apps Scriptの「スクリプトプロパティ」に保存します。
操作手順
Apps Script画面で、左側の歯車アイコンを押します。
プロジェクトの設定
↓
スクリプト プロパティ
↓
スクリプト プロパティを追加
次のように入力します。
| 項目 | 入力内容 |
|---|---|
| プロパティ | GEMINI_API_KEY |
| 値 | 取得したAPIキー |
Apps ScriptにはPropertiesServiceがあり、スクリプト単位などでプロパティを保存できます。APIキーのような設定値は、コードに直接書くより、プロパティとして管理する方が授業では扱いやすいです。
9. コードを貼り付ける
Apps Scriptの Code.gs に、最初から入っているコードを消して、次のコードを貼り付けます。
function onOpen() {
SpreadsheetApp.getUi()
.createMenu('AI企画ツール')
.addItem('企画案を作る', 'generateIdea')
.addToUi();
}
function generateIdea() {
const sheet = SpreadsheetApp.getActiveSpreadsheet().getActiveSheet();
const theme = sheet.getRange('B3').getValue();
if (!theme) {
SpreadsheetApp.getUi().alert('B3に企画テーマを入力してください。');
return;
}
const prompt = `
あなたは学生向けの企画作成を手伝うAIです。
次のテーマをもとに、初心者にも分かりやすい企画案を作ってください。
テーマ:
${theme}
以下の形式で出してください。
1. 企画タイトル
2. 誰に届けるか
3. 何を伝えるか
4. 画像にしやすい場面
5. 15秒動画にしやすい場面
6. 1ページLPに載せる内容
7. この企画のよいところ
条件:
・難しい言葉を使わない
・短く分かりやすく
・学校の授業で使いやすい内容にする
`;
const result = callGemini(prompt);
sheet.getRange('B5').setValue(result);
}
function callGemini(prompt) {
const apiKey = PropertiesService.getScriptProperties().getProperty('GEMINI_API_KEY');
if (!apiKey) {
throw new Error('GEMINI_API_KEY が設定されていません。スクリプトプロパティを確認してください。');
}
const url = 'https://generativelanguage.googleapis.com/v1beta/models/gemini-2.5-flash:generateContent?key=' + apiKey;
const payload = {
contents: [
{
parts: [
{
text: prompt
}
]
}
]
};
const options = {
method: 'post',
contentType: 'application/json',
payload: JSON.stringify(payload),
muteHttpExceptions: true
};
const response = UrlFetchApp.fetch(url, options);
const statusCode = response.getResponseCode();
const text = response.getContentText();
if (statusCode !== 200) {
return 'エラーが発生しました。\n\n' + text;
}
const json = JSON.parse(text);
return json.candidates?.[0]?.content?.parts?.[0]?.text || '回答を取得できませんでした。';
}
Apps Scriptから外部APIへHTTPリクエストを送る場合は、UrlFetchAppを使います。UrlFetchAppは、URLにリクエストを送ってレスポンスを取得するためのApps Scriptのサービスです。
10. 保存する
コードを貼ったら、保存します。
Ctrl + S
または
Command + S
保存できたら、Apps Scriptの画面を閉じずにそのままにしてください。
11. 最初の実行と権限許可
初回だけ、権限の許可が必要です。
Apps Scriptの上にある関数選択で、次を選びます。
generateIdea
そのあと、実行ボタンを押します。
初回は、Googleから権限確認が出ます。
権限を確認
↓
自分のGoogleアカウントを選ぶ
↓
詳細
↓
安全ではないページに移動
↓
許可
自分で作ったApps Scriptなので、この授業では許可して進めます。
不安な場合は、先生に確認してください。
12. スプレッドシートに戻る
スプレッドシートに戻って、ページを再読み込みします。
すると、上のメニューに次が追加されます。
AI企画ツール
表示されない場合は、スプレッドシートを更新してください。
13. 実行してみる
スプレッドシートのB3にテーマを入れます。
例です。
学校祭をもっと楽しむための案内サイト
次に、メニューを押します。
AI企画ツール
↓
企画案を作る
しばらく待つと、B5にAIの回答が入ります。
14. うまくいった時の完成イメージ
B5に、次のような内容が表示されれば成功です。
1. 企画タイトル
学校祭ナビ
2. 誰に届けるか
学校祭に来る新入生や保護者
3. 何を伝えるか
見どころや回り方を分かりやすく伝える
4. 画像にしやすい場面
校門、屋台、展示、ステージ
5. 15秒動画にしやすい場面
学校に入る、マップを見る、展示を回る
6. 1ページLPに載せる内容
見どころ、時間、場所、楽しみ方
7. この企画のよいところ
初めて来る人でも迷わず楽しめる
ここまでできれば、6-1は成功です。
15. よくあるエラー
エラー1:メニューが出ない
原因は、スプレッドシートを更新していないことが多いです。
スプレッドシートを再読み込みする
それでも出ない場合は、Apps Scriptに onOpen があるか確認します。
エラー2:GEMINI_API_KEY が設定されていません
スクリプトプロパティにAPIキーが入っていません。
確認する場所です。
Apps Script
↓
プロジェクトの設定
↓
スクリプト プロパティ
↓
GEMINI_API_KEY
エラー3:回答を取得できませんでした
APIからの返答形式が想定と違う可能性があります。
まずは、B5にエラーメッセージが表示されていないか確認します。
エラー4:APIキーを他の人に見せてしまった
すぐに新しいAPIキーを作り直してください。
APIキーは公開しないでください。
近年、APIキーの流出による不正利用や高額請求の事例も報道されています。授業では、APIキーをコードに直接書かず、公開場所に置かないことを必ず守ってください。
16. 無料で使う時の注意
Google AI StudioやGemini APIには無料で試せる枠がありますが、利用可能なモデル、回数、料金条件は変更される可能性があります。授業前には、Google公式の料金ページを確認してください。
授業では、次のルールにすると安全です。
大量に連続実行しない
同じテーマで何度も押しすぎない
APIキーを共有しない
エラーが出たら止める
17. 今日のゴール
このページのゴールは、すごいアプリを完成させることではありません。
まずは、次の流れを体験することです。
スプレッドシートに入力する
↓
Apps Scriptを動かす
↓
AI APIに送る
↓
AIの回答を表示する
ここまでできれば、次の授業で次のような機能を増やせます。
企画書を自動生成する
画像プロンプトを作る
15秒動画台本を作る
LP構成を作る
Google Docsに出力する
チェックリスト
| チェック | 内容 |
|---|---|
| Googleスプレッドシートを作った | |
| B3に企画テーマを入れた | |
| Apps Scriptを開いた | |
| Google AI StudioでAPIキーを作った | |
| スクリプトプロパティにGEMINI_API_KEYを保存した | |
| Code.gsにコードを貼った | |
| 初回実行と権限許可をした | |
| スプレッドシートにAI企画ツールメニューが出た | |
| 企画案を作るを押した | |
| B5にAIの回答が表示された |
まとめ
今回は、GAS、スプレッドシート、AI APIをつなぐ最初の仕組みを作りました。
大事なことは、次の3つです。
- スプレッドシートは入力画面になる。
- Apps ScriptはAI APIを呼び出す処理になる。
- AI APIは文章を生成して結果を返す。
つまり、今日作ったものは小さいですが、考え方はかなり大きいです。
自分専用のAIアプリを作る入口
次のページでは、スプレッドシートをもう少し整えて、企画情報を入力しやすい「AIの操作画面」にしていきます。