Googleカレンダーの予約スケジュールからGASで顧客情報を取得してみた
システム開発部の渡邉です。
今回はGoogleカレンダーの予約スケジュール機能とGAS（Google App Script）を連携して、顧客情報を取得する方法について書いていきたいと思います。
読者にはプログラミング初心者という方もいると思うので、出来るだけ分かりやすい説明を心掛けたいと思いますが、コードの内容までは分からないという場合もあると思います。
その場合はコピー&ペーストでも、同じものが作れるように書いていくので、初心者の方も是非チャレンジしてみてください。
今回作るプログラムの全体像は以下の通りです。
本記事では顧客情報の取得をメインに取り扱いますが、取得後は何か処理を行うのが一般的なため、今回はスプレッドシートへの書き出しをゴールとして進めたいと思います。
目次
予約スケジュールとは
GAS（Google App Script）とは
Google Calendar APIで顧客情報を取得する
取得した情報をスプレッドシートに書き出す
トリガーの設定
環境変数の設定
予約スケジュールとは
Googleカレンダーの予約スケジュールとは、よく見る予約ページを簡単に作れる機能です。
予約にかかる手間を省くことができる上、Googoleカレンダーに予約情報が自動で追加されるためとても便利です。
作成はカレンダーページの左上から行うことができます。
今回は"ご来店予約"という名前で、姓、名、メールアドレス、の既存の値に加えて、電話番号とご相談内容を追加して作成したいと思います。
実際に予約ページを開いてみると、作成ができていることが確認できると思います。
既にスケジュールが入っている箇所については自動的に候補から外してくれています。
共有ボタンから共有を行うことで、実際にお客様がこのページを使って予約ができるようになります。
GAS（Google App Script）とは
GAS（Google App Script）とはGoogleが提供するクラウドベースのプログラミング環境で、Google Workspaceのアプリケーション（Googleスプレッドシート、Googleカレンダー、Gmailなど）を自動化したり、拡張したりするためのツールです。
JavaScriptベースなので、プラグラム初心者でも比較的簡単に記述することができます。
新しいプロジェクトはGASのHome画面から作成していきます。
試しに以下のコードのを記載して保存（実行ボタン左）後、実行を押してみましょう。
function myFunction() {
console.log('Hello World!')
}”Hello World!”という文字が、実行ログという箇所に出力されるのが分かると思います。
console.log()を書いて実行を押すと、この実行ログという箇所に内容が表示されます。
基本的にGASの実装ではこのコードの欄にコードを書き込んで、実行ボタンを押して実行ログを確認するという手順で進めていきますので、基本操作として覚えておいて下さい。
Google Calendar APIで顧客情報を取得する
Google Calendar APIの追加
まずは今回使うGoogle Calendar APIの追加を行っていきます。
左のサイドバーからサービスを選択すると追加画面が開くので、ここでGoogle Calendar APIを選択して追加します。
最新のイベント情報を取得する
ではここから実際にコードを書いていきましょう。
今回はカレンダーに新しく追加されたイベント情報だけを取ってくるようにしたいので、5分前から現在の時間までのイベントを取得するようにします。
以下の内容を先程"Hello World!"の書いたコードの欄に貼り付けていきましょう。
const calendarId = 'xxxxxxxxxx@gmail.com' // 自分のカレンダーIDを設定
// イベントから顧客情報を取得
function getCustomerData() {
const now = new Date(); // 現在の時刻を取得
const fiveMinutesAgo = new Date(now.getTime() - 5 * 60 * 1000); // 5分前のタイムスタンプを取得
const optionalArgs = {
updatedMin: fiveMinutesAgo.toISOString(), // 5分前以降に更新されたイベントを取得
orderBy: 'updated', // 更新日時でソート
maxResults: 10 // 取得するイベントの最大数を設定（必要に応じて変更可能）
};
// Google Calendar APIからイベントを取得
const events = Calendar.Events.list(calendarId, optionalArgs);
// 'ご来店予約'で始まるイベントを探す
const event = events.items.find((item) => item.summary.startsWith('ご来店予約'))
// イベントが見つからなかった場合
if (!event) {
console.log('No events found.');
}
// イベント情報を出力する
console.log({event})
}冒頭のcalendarId変数の部分はご自身のカレンダーIDに修正する必要があります。
一般的にはご自身のメールアドレスになっているはずですが、Googleカレンダーの設定画面で確認することができます。
コードの内容についても簡単に説明します。
このコードではGoogle Calendar APIのCalendar.Events.listという機能を使ってイベントをリストとして取得しています。
optionalArgsではその取得するイベントの条件を設定しています。
今回は以下の条件で取ってきます。
5分前以降に更新されたイベント
更新日時でソート
最大10件
つまりevents.itemsには新しいイベントが更新順で最大10件入ることになります。
以下のコードではその10件の中の中から、タイトル（summary）が"ご来店予約"で始まるイベントを探しています。
// 'ご来店予約'で始まるイベントを探す
const event = events.items.find((item) => item.summary.startsWith('ご来店予約'))予約の場合タイトルは予約スケジュールの名称が表示されるため、今回は"ご来店予約"になります。
コードが書けたら実際に動くかテストしていきましょう。
まずは先程作った予約スケジュールからご来店予約を入力し予約を行います。
予約完了したらGASのページに戻り実行ボタンを押しましょう。
権限の確認
初回は以下の承認画面が表示されますので、権限を確認ボタンを押して承認を行って下さい。
なおまれに、「このアプリはGoogleで確認されていません」というエラーが表示される場合があります。
その際は下の"詳細"を押して（安全ではないページ）に移動を押すことで認証画面に戻ることができます。
実行結果
実行結果は以下の通りです。
結果を見ると顧客情報がdescriptionとして、改行コード（\n）で区切られて保存されているのが分かります。
ではここからそれぞれの情報を抽出していきましょう。
Descriptionから顧客情報を抽出する
ではDescriptionから顧客情報を取得します。
最後の1行（console.log({event})）の部分を以下に書き換えて実行してみましょう。
// イベント情報を出力する
const customerDatas = event.description.split('\n', 4).slice(1);
console.log(customerDatas)実行結果
[ 'テスト花子', 'test@example.com', '098-765-4321' ]配列に[名前, メールアドレス, 電話番号]が入っているのが分かると思います。
これで抽出が完了しました。
取得した情報をスプレッドシートに書き出す
スプレッドシートへの書き出しロジックを追加した全体のコードが以下です。
const calendarId = 'xxxxxxxxxx@gmail.com' // 自分のカレンダーIDを設定
const spreadsheetId = 'xxxxxxxxxxxxxxxxxxxx' // 書き出すスプレッドシートのIDを設定
// イベントから顧客情報を取得
function getCustomerData() {
const now = new Date(); // 現在の時刻を取得
const fiveMinutesAgo = new Date(now.getTime() - 5 * 60 * 1000); // 5分前のタイムスタンプを取得
const optionalArgs = {
updatedMin: fiveMinutesAgo.toISOString(), // 5分前以降に更新されたイベントを取得
orderBy: 'updated', // 更新日時でソート
singleEvents: true, // 単一イベントに展開（リピートイベントの場合）
maxResults: 10 // 取得するイベントの最大数を設定（必要に応じて変更可能）
};
// Google Calendar APIからイベントを取得
const events = Calendar.Events.list(calendarId, optionalArgs);
// 'ご来店予約'で始まるイベントを探す
const event = events.items.find((item) => item.summary.startsWith('ご来店予約'))
if (!event) {
// イベントが見つからなかった場合
console.log('No events found.');
return null
}
// 顧客情報を配列で返す
const customerData = event.description.split('\n', 4).slice(1);
return customerData
}
// 顧客情報をスプレッドシートへ書き出し
function exportCustomerDataToSheet() {
const data = getCustomerData()
if (data) {
const spreadsheet = SpreadsheetApp.openById(spreadsheetId);
const sheet = spreadsheet.getSheetByName('シート1'); // シート名を入力
// スプレッドシートへ書き出し
sheet.appendRow(data);
console.log(data)
console.log('登録が完了しました')
} else {
console.log('エラー: 顧客データが取得できませんでした。');
}
}今回は顧客情報の取得がメインなので追加したコードの詳細については割愛しますが、コピー&ペーストをして以下のテスト方法に沿って進めて頂ければ動作が確認出来るようになっています。
テスト方法
①スプレッドシートを新規で作成する
テスト時に情報を出力するためのスプレッドシートを新しく作成して下さい。
②コードにシートの名称を設定する
コードの以下の部分に書き込むシートの名称を設定します。
const sheet = spreadsheet.getSheetByName('シート1'); // シート名を入力デフォルトは”シート1”となっているため、変更がなければそのままで問題ありません。
③spreadsheetId変数にスプレッドシートのIDを設定する
冒頭のspreadsheetId変数に、先程作成したスプレッドシートのIDを設定します。
const spreadsheetId = 'xxxxxxxxxxxxxxxxxxxx' // 書き出すスプレッドシートのIDを設定IDはスプレッドシートページのURLから取得することができます。
（例: https://docs.google.com/spreadsheets/d/{ spreadsheetId }/edit の部分）
④スプレッドシートに表頭をつける
今回は出力された内容が何の項目か分かる様、1行目に表頭をつけておきましょう。
⑤予約スケジュールから予約を行う
上記が完了したら先程同様予約スケジュールから予約を追加しましょう。
⑥プログラムを実行する
この際実行ボタン横の関数名をgetCustomerDataからexportCustomerDataToSheetに変更する必要があります。
全てが完了したら実行ボタンを押していきましょう。
実行結果
スプレッドシートを確認し情報が書き出されていれば完了です。
トリガーの設定
ここまでカレンダー更新後のプログラム実行は手動で行なっていましたが、トリガーというプログラムの発火条件を設定することで、自動実行をさせることができるようになります。
今回はカレンダーが変更された時にプログラムが実行されるよう、トリガーを設定していきます。
左の時計のマークに入ってトリガーを追加ボタンを押します。
実行する関数としてはexportCustomerDataToSheetを指定します。
「取得した情報をスプレッドシートに書き出す」の項目をスキップした人はgetCustomerDataを設定して実行することもできます。
“カレンダーのオーナーのメールアドレス”はどのカレンダーを監視するかを指定するものなので、カレンダーIDでも設定可能です。
ではトリガーの動作確認をしていきましょう。
左メニューの"トリガー"の下にある"実行数"に入って、自動実行を確認します。
予約スケジュールから予約を行うと実行のログが表示され、トリガーが正しく動作していることが確認できると思います。
これで実装は完了です。
環境変数の設定
最後に補足としてGASでの環境変数を設定方法を紹介しておきます。
環境変数とは、関数を跨いで使えるグローバルな変数のことです。
よく使う変数は環境変数として設定しておくことで、コードを書き換えずに変数の内容を変更できるためとても便利な機能です。
今回は現在コードに直接記述している以下の内容を環境変数として設定してみましょう。
const calendarId = 'xxxxxxxxxx@gmail.com' // 自分のカレンダーIDを設定
const spreadsheetId = 'xxxxxxxxxxxxxxxxxxxx' // 書き出すスプレッドシートのIDを設定GASの環境変数は歯車のマークから入ったページ1番下にある、”スクリプト プロパティ”に設定します。
環境変数は原則大文字のスネークケースで書くのが一般的なため、今回の場合は以下のようになります。
コード上では以下のように呼び出すことで環境変数を利用することができます。
const calendarId = PropertiesService.getScriptProperties().getProperty("CALENDER_ID")
const spreadsheetId = PropertiesService.getScriptProperties().getProperty("SPREADSHEET_ID")まとめ
ここまでGASを使った予約スケジュールとの連携方法について書いてきました。
今回は最後の処理をスプレッドシートへの書き出しとしましたが、別のシステムへの登録を行いたい場合はexportCustomerDataToSheetを、APIを叩く関数等に変更して利用することもできます。
現在様々な業種でオンライン予約が利用されています。
Googleカレンダーの予約スケジュール機能は、その導入にとても役に立つツールだと思います。
是非GASの連携で予約スケジュールをより使いやすくカスタマイズして使ってみて下さい。