github actions + vercel でスプラ3のスケジュール画像を自動生成&配信する環境を作った

動作概要

  • github actionsのスケジューリング機能で2時間おきに画像生成スクリプトを走らせる
  • 生成画像をgithubにpushしてvercelで自動デプロイ、publicフォルダの静的コンテンツとして配信できるようにした。

https://github.com/yotsugi-vip/vip-splat3-schedule

画像生成

生成スクリプト

  • splat3 API(有志公開の非公式API)
  • node-canvas
  • node-fetch

上記APIから24時間分のスケジュールをjsonで取得、cli上での動作となるのでnode-canvasjsonの内容を画像として吐き出すようにした。
オフセット設定がめんどくさかったけどまぁまぁ見れる形で出力できるようにした。

自動実行

github actionsのスケジューリング機能を使って2時間おきに画像生成スクリプトを実行するように指定
画像生成後はnextjsのpublicフォルダに格納しcommit & pushまで実行。
vercel上でpushを検知して自動ビルドしてくれる。

失敗談

vercelの仕様をよく読んでなかった点

最初期の環境の構成として

定期POST → API実行 → 生成画像公開の手順で作成したのだが、
vercelのpublicフォルダは書き込み不可なのを把握してなかった。

github actionsのスケジューラのTZがJSTじゃない

スプラトゥーンのステージは奇数時毎に更新されるのでスケジューラを

1,3,5,7,9,11,13,15,17,19,21,23時に設定したが、実際動作させると1時間ずれて実行されていた。
原因はgithub actionがUTC基準で動いていたためJSTの+9時間差で実行されていたから。
スケジューラはUTC基準で偶数時毎に起動するように変更した。