目次
勤怠打刻システム(LIFF版)仕様書 v1.0
アプリ名:TimeCard
概要
本システムは、LINEのLIFFとGoogle Apps Script(GAS)を活用して、NFCまたはQRコードをトリガーにスマホから出退勤を記録できるシステムです。位置情報を取得し、許可されたエリア内からのみ打刻が可能です。
使用技術
- フロントエンド:HTML / JavaScript / LIFF SDK
- バックエンド:Google Apps Script(GAS)
- データ保存先:Google スプレッドシート「勤怠データ」シート
- 位置情報取得:HTML5 Geolocation API(スマホ限定)
URL・ID一覧
- LIFF ID:
2099999999-xxxxxxxx
- GAS URL:
https://script.google.com/macros/s/xxxxxxxxxxxxxxxxxxxxxxxxxxxx/exec
- 起動URL例:
https://liff.line.me/2099999999-xxxxxxxx?abc=123
処理の流れ
- NFCまたはQRコードから上記URLにアクセス
- LIFFによるLINEログイン(userId / displayNameを取得)
- 位置情報を取得し、許可エリア(高崎市鞘町20-1)との距離を判定
- 半径50m以内であれば出退勤データをGASへPOST
- GASがスプレッドシートへ記録(日時、ID、名前、ステータス、位置リンク)
- 成功時に画面表示+ウィンドウ自動クローズ(3秒後)
送信データ例
{ "userId": "Uxxxxxx", "displayName": "山田太郎", "datetime": "2025-04-22T09:24:00.000Z", "type": "out", "location": "https://www.google.com/maps?q=36.32xxx,139.00xxx" }
スプレッドシート記録内容
日時 | ユーザーID | 名前 | ステータス | 位置情報 |
---|---|---|---|---|
2025/04/22 09:24 | Uxxxxxx | 山田太郎 | out | 地図で見る |
ステータスメッセージ一覧
- 出勤成功:出勤完了! このウィンドウはまもなく閉じます。
- 退勤成功:退勤完了! 今日もお疲れさまでした。 このウィンドウはまもなく閉じます。
- エリア外:許可されたエリア外からのアクセス(距離表示) 出勤/退勤処理はキャンセル
- 位置情報取得失敗:位置情報の取得に失敗しました。位置情報アクセスを許可してください。
セキュリティと制限
- no-cors のため fetch レスポンスは取得不可
- スマホの位置情報許可が必要(初回アクセス時に確認)
- PCでは動作不可(スマホ専用)
推奨環境について
- NFCが読めるスマホ(iPhoneXより古いとダメかも。2018年以降のものならたぶんOK)
- LINEのアカウントでなりすましを防止(ユニークを特定)しているためLINE必須。
- Androidは対象外(未検証)。(※iPhoneSE第3世代、iOS18.3.2で動作確認済み)