勤怠打刻システム TimeCard

勤怠打刻システム(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

処理の流れ

  1. NFCまたはQRコードから上記URLにアクセス
  2. LIFFによるLINEログイン(userId / displayNameを取得)
  3. 位置情報を取得し、許可エリア(高崎市鞘町20-1)との距離を判定
  4. 半径50m以内であれば出退勤データをGASへPOST
  5. GASがスプレッドシートへ記録(日時、ID、名前、ステータス、位置リンク)
  6. 成功時に画面表示+ウィンドウ自動クローズ(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で動作確認済み)
本システムおよび仕様書は 有限会社ジャパスタリア が著作・運用しています。
無断転載・複製を禁じます。