▼スパム防止用画像の自動更新
掲示板や各機能のコメント投稿時、PCとスマートフォンでは画像の数字を入力する項目が必須となっています。
ですが、一部端末において画像が更新されず(以前使ったものが端末に残っていて表示されるため)入力エラーになる場合があるようです。
この問題を、jQuery(JavaScript)を使って画像を強制的に更新することで解消します。
※JavaScriptが有効な場合にのみ適用できます。

1、名前付きボックスで画像の独自タグを囲みます。
<div id="capimg">#formCapImg#</div>
※#は半角。#form#を使われている方でもおそらく可能。

2、HEAD内にjqueryを記述。
<pc>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#capimg img")[0].src = $("#capimg img")[0].src+"?dummy="+Math.random();
});
</script>
</pc>
参考(外部サイト)↓
http://www.lumber-mill.co.jp/notes/tips/130215_js.html

何をしているかというと、ページを開いた時に"capimg"の名前を持つ要素の中にある画像"img"を強制的に更新(リロード)させます。
ただ強制リロードだけでは画像が変わらない場合があるので、『src="/cap"』の『/cap』の後ろに乱数を追加しています。
つまりは、
http://nanos.jp/cap
http://nanos.jp/cap?0.000
http://nanos.jp/cap?0.999
という感じにURLの最後に『?ランダムな数字』がつきます。結果的には、上の3つとも同じページへ飛びます。
ただ、URL的に"違うものだ"とブラウザは判断するので端末内にある以前の画像を呼び出すのではなく毎回新しい画像で表示できるようになります。
詳しくは下の参考URLへどうぞ。

参考(外部サイト)↓
http://blog.3ot.net/design/javascript/20091210063205.html
http://www.nishishi.com/blog/2013/04/avoid_cache_que.html
http://www.soul2golf.com/works/357.html

なお、キャッシュ無効のmeta設定は必ず入れておくようにして下さい。
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Cache-Control" content="no-cache" />
※ナノのデフォルトタグ『出力する』では自動挿入されます。
PREV][NEXT]
×
「#エロ」のBL小説を読む
BL小説 BLove
- ナノ -