1エンドツーエンド処理
データ受信
URL エンコード、multipart、JSON に対応します。
安全な検証
reCAPTCHA、入力項目、画像を検証します。
データ保存
画像は Drive、文字情報は Sheets に保存します。
通知と記録
メール送信と LOG へのエラー記録を行います。
- application/x-www-form-urlencoded、multipart/form-data、application/json を受信します。
- Google reCAPTCHA を検証します。
- 氏名、電話番号、メールアドレス、メッセージ、画像を検証します。
- Base64 画像を指定した Google Drive フォルダへ保存します。
- フォーム内容を Google Sheets に記録します。
- 管理者へ HTML メールと画像添付を送信します。
- 画像、メール、メイン処理のエラーを LOG シートへ記録します。
- フロントエンドへ統一形式の JSON を返します。
2推奨 Apps Script ファイル構成
Code.gs DriveAuthorization.gs appsscript.json
- Code.gs:リクエスト処理、検証、保存、通知、エラーログを実装します。
- DriveAuthorization.gs:Drive OAuth 認可とフォルダアクセス確認を手動で実行します。
- appsscript.json:OAuth スコープを明示する任意の Manifest です。
3完全最適化コード:Code.gs
以下のコードを Code.gs に貼り付けます。識別子や Google API 名はそのまま利用できるよう維持しています。
完全な Code.gs を展開/折りたたむ
4Drive 認可とアクセス確認
手動実行する関数名の末尾にはアンダースコアを付けないでください。末尾にアンダースコアがない関数は Apps Script エディタ上部の関数一覧に表示されやすくなります。
完全な DriveAuthorization.gs を展開する
5必須設定
最低限、以下の設定を更新してください。
SPREADSHEET_ID: "実際の Google Spreadsheet ID", FOLDER_ID: "実際の Google Drive フォルダ ID", SHEET_NAME: "Sheet1", ADMIN_EMAIL: "実際の管理者メールアドレス"
Spreadsheet ID
URL 例:https://docs.google.com/spreadsheets/d/1AbCdEf123456/edit
ID:1AbCdEf123456
Folder ID
URL 例:https://drive.google.com/drive/folders/1XyZ987654
ID:1XyZ987654
6reCAPTCHA Secret の設定
Apps Script で以下を開きます。
プロジェクトの設定 → スクリプト プロパティ → スクリプト プロパティを追加
| プロパティ | 値 |
|---|---|
RECAPTCHA_SECRET
|
実際の reCAPTCHA Secret Key |
7Google Sheets の列順
| 列 | 内容 |
|---|---|
| A | 送信日時 |
| B | 氏名 |
| C | 電話番号 |
| D | メールアドレス |
| E | メッセージ |
| F | 画像リンク |
LOG シートが存在しない場合は自動作成されます。
8Google Drive 認可の実行
- authorizeDriveAccess を DriveAuthorization.gs に貼り付けます。
- 実際の TEST_FOLDER_ID を設定します。
- プロジェクトを保存します。
- Apps Script エディタの関数一覧から authorizeDriveAccess を選択します。
- 「実行」をクリックします。
- Google OAuth 認可フローを完了します。
- 対象 Drive フォルダにテスト用テキストファイルが作成されたことを確認します。
9authorizeDriveAccess が関数一覧に表示されない場合
- 関数名の末尾にアンダースコアを付けないでください。
- 関数は最上位で宣言してください。
- 先にプロジェクトを保存してください。
- どの .gs ファイルにも構文エラーがないことを確認してください。
- Apps Script エディタを再読み込みしてください。
// 正しい例:手動実行可能 function authorizeDriveAccess() {} // 手動実行の入口としては非推奨 function authorizeDriveAccess_() {} // 内部補助関数では末尾アンダースコアを使用可能 function parseDataUrl_() {}
10Google Drive フォルダ共有権限
OAuth 認可とフォルダ共有は別の要件です。Web アプリをデプロイするアカウントは以下を満たす必要があります。
- フォルダを所有している、または明示的に共有されている。
- ファイルを作成または編集する権限がある。
11Web アプリのデプロイ
デプロイの種類:ウェブアプリ 次のユーザーとして実行:自分 アクセスできるユーザー:Web サイト要件に応じて選択
デプロイ者として実行する場合:
- Drive はデプロイ者の権限を使用します。
- Spreadsheet はデプロイ者の権限を使用します。
- MailApp はデプロイ者のメール送信上限を使用します。
- Web サイト訪問者は Drive フォルダ権限を必要としません。
コード更新後の再デプロイ
デプロイ → デプロイを管理 → 編集 → 新しいバージョンを選択 → デプロイ
本番 Web サイトでは /exec URL を使用してください。
12任意の appsscript.json Manifest
通常、Apps Script は必要な権限を自動推測します。OAuth スコープを明示する場合は以下を使用します。
{"timeZone":"Asia/Tokyo","exceptionLogging":"STACKDRIVER","runtimeVersion":"V8","oauthScopes":["https://www.googleapis.com/auth/drive","https://www.googleapis.com/auth/spreadsheets","https://www.googleapis.com/auth/script.send_mail","https://www.googleapis.com/auth/script.external_request"]}
スコープ変更後は通常、再認可が必要です。
13フロントエンド送信例
FormData
JSON
14レスポンス形式
成功
{"ok":true,"statusCode":200,"requestId":"一意の識別子","mailSent":true,"imageSaved":true,"fileUrl":"Google Drive ファイル URL"}
失敗
{"ok":false,"statusCode":500,"requestId":"一意の識別子","error":"エラー内容"}
本番推奨設定:RETURN_DEBUG_INFO: false
15画像データ形式
完全な Data URL
data:image/png;base64,iVBORw0KGgoAAA...
生の Base64
iVBORw0KGgoAAA...
生の Base64 を送信する場合は、次も指定します。
image_mime=image/png
許可形式:PNG、JPEG、JPG、WebP、GIF。既定上限は 5 MB です。
16セキュリティチェックリスト
- reCAPTCHA Secret は Script Properties のみに保存する。
- 本番環境ではデバッグレスポンスを無効にする。
- 画像 MIME タイプとファイルサイズを制限する。
- フロントエンドから受信した summary_html を信用しない。
- escapeHtml_() でメール HTML インジェクションを防止する。
- safeSheetText_() でスプレッドシート数式インジェクションを防止する。
- 完全なトークンや Base64 画像をログへ記録しない。
- 本番では MAKE_FILE_PUBLIC: false を既定にする。
- 漏えいした Secret は無効化して再発行する。
17よくあるエラーと対処方法
Access denied: DriveApp
OAuth 認可未完了、別アカウントでログイン、Workspace 管理者による Drive 制限、権限取り消し、Manifest の Drive スコープ不足などが考えられます。
- authorizeDriveAccess を実行します。
- デプロイ用アカウントで認可を完了します。
- フォルダ ID を確認します。
- フォルダ共有権限を確認します。
フォルダが見つからない
完全な URL ではなく、フォルダ ID のみを渡してください。
DriveApp.getFolderById("FOLDER_ID_ONLY");
エディタでのテストは成功するが doPost が失敗する
- Web アプリを新しいバージョンへ更新したか確認します。
- Web サイトが最新の /exec URL を使用しているか確認します。
- Web アプリが正しいアカウントとして実行されているか確認します。
- デプロイ用アカウントが Sheet と Drive フォルダへアクセスできるか確認します。
- Apps Script の「実行数」ページと LOG シートを確認します。
他のユーザーが画像リンクを開けない
これは OAuth ではなく Drive の共有設定問題です。MAKE_FILE_PUBLIC: true を設定できますが、Workspace ポリシーで公開共有が制限される場合があります。
reCAPTCHA action が一致しない
// フロントエンド grecaptcha.execute(siteKey, { action: "submit" }); // バックエンド RECAPTCHA_EXPECTED_ACTION: "submit"
フロントエンドとバックエンドの値を完全に一致させてください。
18完了チェックリスト
- Spreadsheet ID を置き換えた。
- Folder ID を置き換えた。
- シート名が正しい。
- 管理者メールアドレスが正しい。
- Script Properties に RECAPTCHA_SECRET がある。
- authorizeDriveAccess を手動実行した。
- Drive テストファイルが作成された。
- デプロイ用アカウントが Drive フォルダを編集できる。
- Sheet の列順が正しい。
- 新しい Web アプリバージョンをデプロイした。
- 本番サイトで /exec URL を使用している。
- 本番で RETURN_DEBUG_INFO が false になっている。
- 実際のフロントエンド送信テストを完了した。
- Sheets、Drive、メール、LOG、実行履歴を確認した。
19推奨設定順序
- 対象の Google Drive フォルダを作成する。
- Google Spreadsheet を作成する。
- ワークシートの見出し行を追加する。
- GAS デプロイ用アカウントへフォルダを共有する。
- 完全なコードを貼り付ける。
- CONFIG の設定を完了する。
- reCAPTCHA Secret を Script Properties に追加する。
- authorizeDriveAccess を実行する。
- authorizeRequiredServices を実行する。
- Web アプリとしてデプロイする。
- /exec URL をフロントエンドへ設定する。
- テストフォームを送信する。
- Sheets、Drive、メール、LOG、実行履歴を確認する。