今回は連続して再生しないGIFアニメ画像を、リロード毎に再生する方法をご紹介します。
まずGIFアニメ画像についてですが、これは連続再生と一回限りの再生があります。
これは画像を出力する際、画像生成ソフト等で指定できます。
今回はすでに連続再生なしの画像があるものとして話を進めます。
問題は連続再生なしのGIFアニメ画像は一回読み込まれると、
キャッシュといってブラウザに保存されるため、
再度リロードした際、GIFアニメ画像の一番最後のフレームに飛んでしまいます。
では、どうすればいいか？
簡単です。毎回がGIFアニメ画像をキャッシュさせずに読み込ませればいいのです。
これは通常の画像読み込みでは実現できません。
しかし、ブラウザはURLが変わると必ず再読み込みするという性質があります。
これを逆手にとって画像のURLを読み込みに影響がないよう変更します。
具体的にはクエリパラメータを変更します(以下は存在しないURLですが一例です)
https://yagimaru3.net/test.jpg?1732485958
このように画像ファイルの後ろに?マークとUNIXタイムを入れると良いでしょう。
UNIXタイムはプログラムが仕様できる動的環境ならそのまま利用してもいいですし、
静的なファイルしか置けない環境ならば
JavaScriptからUNIXタイムを生成しても良いでしょう。
問題は必ずページを開く際にユニーク（単一）なURLとなっていれば良いのです。
この方法はキャッシュを無視してhtmlファイルを読み込ませたい場合にも使えるので、
更新したい時に確実に反映したものを見てもらいたい時に使える方法です。
元ファイルのリンクがユニークなURLを参照できているかという問題はありますが＾＾；
今回は以上となります。何らかの参考になれば幸いです。