フォームを実務で運用する際、選択肢が増減するたびにソースコードを書き換えるのは非効率的です。
スプレッドシートの「マスタ設定」シートをデータベースと見立て、各列から選択肢を動的に抽出してJavaScriptの配列に変換するバックエンド関数を用意しておくと、シートのセルを編集するだけで即座にフォームへ反映されるようになります。
今回は、そのデータ抽出関数の仕組みと、エラーを防ぐための堅牢な実装手法を詳しく解説します。
連載目次：GASで作る高機能Webフォーム開発ガイド
スプレッドシートのセル範囲から配列を安全に抽出・整形するフロー
ハードコードを排除する設計の利点
WebページのHTML内に選択肢を直接記述してしまう（ハードコード）と、新しいサービスが追加されたり受付項目が変更されたりするたびに、開発者がコードを開いて修正・再デプロイを行わなければなりません。
選択肢データをスプレッドシートで一元管理することで、以下のような業務上のメリットが生まれます。
- 現場の担当者がスプレッドシートを編集するだけで、Web上の選択肢がリアルタイムに更新される
- プログラムに触れる必要がないため、人的なコード破損リスクを排除できる
- 選択肢の追加履歴や過去の項目もスプレッドシート上で簡単に管理できる
マスタデータ取得関数の基本コード
以下は、マスタ設定シートのA列から「ご相談カテゴリー」の一覧を取得する関数の実装例です。
// 設定シートからカテゴリーリストを取得（A列）
function getCategoryList() {
try {
const ss = SpreadsheetApp.openById(SPREADSHEET_ID);
const settingSheet = ss.getSheetByName('マスタ設定');
if (!settingSheet) {
return [];
}
const lastRow = settingSheet.getLastRow();
if (lastRow < 2) {
return [];
}
const categoryRange = settingSheet.getRange(2, 1, lastRow - 1, 1);
const categories = categoryRange.getValues().flat().filter(item => item && String(item).trim() !== '');
return categories;
} catch (err) {
return [];
}
}データ抽出と整形の各ステップ解説
この関数で行われている処理を、順を追って詳しく紐解いていきましょう。
| 処理ステップ | コードと解説 |
|---|---|
| シートの安全な取得 | SpreadsheetApp.openById と getSheetByName で目的のシートを参照します。シート名が見つからない場合は直ちに空配列 [] を返し、後続のエラーを防ぎます。 |
| データ件数の判定 | getLastRow() でデータが存在する最終行を調べます。1行目は見出し行のため、最終行が2未満（データが0件）の場合は即座に空配列を返却します。 |
| 範囲指定（getRange） | getRange(2, 1, lastRow - 1, 1) により、「2行目の1列目から、行数分（最終行マイナス見出し行1）、1列分」をピンポイントで取得します。 |
| 平坦化（flat） | getValues() が返すデータは [['Web制作'], ['コンサル']] という2次元配列です。flat() を通すことで ['Web制作', 'コンサル'] という扱いやすい1次元配列へ変換します。 |
| 空白除外（filter） | 途中の空行や空白文字（半角・全角スペース）を String(item).trim() !== '' で除外し、純粋に有効な文字だけを抽出します。 |
try-catch 構文による安全対策
一時的な通信遅延や権限の不整合が発生しても、エラーをそのままフロントエンドに投げて画面をクラッシュさせないよう、例外発生時には安全に空配列 [] を返す仕様にしています。
複数列に対応した拡張方法
マスタ設定シートに他の項目（例：B列「希望サービス」、C列「知ったきっかけ」など）を追加する場合も、getRange(2, 列番号, lastRow - 1, 1) の第2引数を変更した関数（getServiceList や getLeadList）を作成するだけで簡単に拡張できます。
まとめと次回の内容
今回は、スプレッドシートから選択肢データを効率的かつ安全に抽出するバックエンド処理を解説しました。
次回は、ブラウザ側のJavaScriptからこれらのGAS関数を非同期で呼び出し、Web画面上にチェックボックスを動的生成するフロントエンド連携の実装について解説します。
