Github pagesを使って公開したページの画像をPushして更新する

以前、育て始めた植物のモニタリングができるページの作成しGithub pagesを使って公開したページの画像をPushして更新していました。pages/github
その内容を記述します。
（センサー値のGoogleスプレッドシートを埋め込んでいたのですが、削除してしまい、表示されていません…。）

Wifi対応のRaspberry PiにUSBカメラを接続し、撮影・アップロードします。
githubのリポジトリをクローンし、その中にcameraというフォルダを作成して作業しました。

フロント側の設定

フロント側では、imageのsrcにhttps://raw.githubusercontent.com/<画像のパス>を指定することで画像を表示することができます。
こちらの場合、https://raw.githubusercontent.com/m1kan1/kaorin-main/main/image.jpgと指定することでpushした画像が表示されます。

使用したもの

• Raspberry Pi3(OSはRaspbian lite)
• USBカメラ

packageのインストール

sudo apt install fswebcam

USBカメラを使用して撮影するために、fswebcamをインストールします。

スクリプトの作成

/home/pi/kaorin-main/camera/push_image_to_git.sh

IMAGENAME=/home/pi/kaorin-main/camera/$(date +%Y%m%d%H%M).jpg
fswebcam -r 1280*960 $IMAGENAME
convert -geometry "40%"  $IMAGENAME /home/pi/kaorin-main/image.jpg

cd $HOME/kaorin-main
git add image.jpg
git commit -m "update image.jpg"
git push origin

撮影された画像を上書きせず残したかったため、日付でファイルを作成します。
convertコマンドで画像を少し圧縮してからgitのリポジトリにimage.jpgという名前でコピーします。
gitのリポジトリに移動し、作成した画像をcommit、pushします。

cronの設定

こちらをcronで繰り返し実行する設定を行います。

crontab -e

以下の設定を行うと毎時間の0分、30分に指定したスクリプトが実行されます。

0,30 * * * * bash /home/pi/kaorin-main/camera/push_image_to_git.sh