【7/10〜12】開成祭に導入されるチケットシステムについて技術解説！
学生団体Keiseiでは、2025年7月10日〜12日に開祭される第9回開成祭のチケットシステム・認証ゲートの開発を担当しています！
この記事では、それらのシステムのアウトラインを解説するとともに、参考となる詳細な技術記事もまとめます！
プレスリリースはこちら（メディアの取材も募集中です！）
Author
学生団体Keisei 副代表 @negishi_tako
たこ系エンジニアやってます。
システムの概要
今回、学生団体Keiseiで開発を担当しているシステムは大まかに以下のようにわけることができます。
チケット発券システム
来場者に生徒を通じて伝えられた、発券番号とPINを使うことでWEB上で発見できるようにします。認証することで、QRコードが表示されるだけでなく、GoogleWalletへの追加をサポートし、生徒がどの企画に所属しているかも見ることができます。チケット管理システム
生徒会執行部や学校がチケットのPINをリセットしたり、プロジェクトを追加したりできるようにします。また、簡易的なログインログのビュー機能やゲート動作ログビュー機能を追加することで、誤って発券がロックされたユーザへの対処を容易にしています。認証ゲートシステム
檜すのこで作成された、認証ゲートを開閉するシステムです。ユーザがQRコードをかざすと、その内容を元に来場者の人数やチケットの有効性を確認し、ゲートの開閉や開閉時間を決定します。監視（アラート）システム
いろいろありますが、まとめて監視システムとしています。チケットシステムの稼働情報の収集やゲートの開閉ログは全て、Grafanaに集約しています。また、死活監視で異常を検知した場合や、ゲートが予期せぬエラーが発生した場合にはDiscordへの通知が行われます。
技術スタック
前提として、5年後も高校生が保守できるように選んでいます。また今後、IaCなどを利用して運用負荷や立ち上げを容易にする予定です！
Hono(TS)
チケットシステムとチケット管理システムのサーバーサイドフレームワークとして採用しました。主に、筆者が使用してみたかったためです。また、
シンプルに速いし、軽い
シンプルなので今後も保守しやすそう
SSRとは違い、フロントとバックエンドを完全に分けられるので、今後の人も保守しやすそう。（どっちかできる人がいれば少しずつ改善されていきそう。）
Vue.js(TS)
チケットシステムとチケット管理システムのフロントエンドフレームワークとして採用しました。
シンプル、学習コストが低い（Reactは難しい）
QRコード読み取りなど、既存のライブラリがある
Reactの必要性がない（複雑なことはあまりしない）
TypeScript
当日予期せぬエラーが発生することがないよう
保守もしやすいよね
Azure(MS)
特定非営利活動法人SETB がクラウド環境を支援してくれた！
さくらのクラウドなども検討したが、PaaS使えた方がいいよね（セキュリティ的にも、負荷の急増的にも、今後の保守のためにも）
使ってるサービス
Azure App Service
Azure Static App
Azure SQL Database
Azure VM
Azure App Insights
Grafana/Prometheus/Loki
筆者が使える。正直、一年目でこれ以外のツールに手を出す余裕はなかった、というところでしょうか。また、
Azure App Insights からもデータを収集できる
Lokiでログのライブビューもできる
Discordのアラート設定も簡単
というので、一通り要件は満たせていると思います。
Tailscale
毎年、VPNサーバを作るのは嫌なので使用しました。複数台あるラズパイにVPNの接続設定をするのは大変です。とは言いつつ、安定性やシンプルさを考え、来年はAzure VPN Gatewayを使って頑張ろうと思います。
Python/Fast API
ゲート本体の動作にはPythonを使用しています。シンプルに扱いやすいですよね。
ゲートから直接DBに接続はしないので、Azure VMにAPIエンドポイントを作り、そこと通信します。
APIはNode.jsにするか迷いましたが、利用したことがなかったのと簡単なことからFast APIを選択しました。
ハードウェア
ゲート本体
Raspberry Pi5
筆者が新しいほうが良いかと思い選んだ結果、苦しんでいます。(GPIOなどがRP1チップというのに変わったため、既存のPythonライブラリは大体動きません。)PoE HAT
ケーブルを減らしたいので。自作ケース
メンバーが3Dプリンターで自作してくれました。すごいですね。サーボモータ
ネットワーク機器
HPE Aruba R8R48A (16Port, PoE 124W)
PoE給電用、メインスイッチ、アンマネージドなので刺せば動きます。HPE Aruba R8R46A (8Port, PoE 64W)
予備といったところ。HPE Aruba IAP-305
スマホからも接続できるよう。YAMAHA RTX 1200
回線を冗長化したいので導入する（つもり）
当日はauとsoftbankの二回線で運用予定です。
実際のシステムの様子
少しずつ撮って、更新しようと思います。ネタバレもあるので。
ツアーのご案内
当日せっかくなので、弊団体の企画としてゲートやシステムの解説を予定しています。くわしくは発券後に当プロジェクトを検索し、ご覧ください。（公開まで多少時間をいただくと思います。）
テックブログ
それぞれのサービスやつまづいたところを個人で記事にしようと思っています。よければそちらもご覧ください。
管理者画面にGoogle SSOを設定したかった話
Azure App InsightsとGrafanaは簡単に連携できた話
ラズパイ5を買うときには注意した方がいい話
誠意執筆中
コメント