F5 や Ctrl+R、Command+R による再読み込みを抑える方法

F5 や Ctrl+R、Command+R などのキーボード操作によるページの再読み込み（リロード）を停止する方法をご説明します。

「すぐ使えるCMS」での問題と対応できる範囲

「すぐ使えるCMS」での編集操作後一覧に戻った時に、ページを再読み込みするとエラーになったり登録が重複したりする事があります。また、Ver. 4.4 と 4.5 では直前に編集した記事が消えてしまう事があります。

この問題は、「一覧を最新に更新」ボタンでページを再読み込みした時は起こらず、F5 や Ctrl+R、Command+R などのキーボード操作によるページの再読み込み（リロード）時に起こります。

Ver. 4.6 以上では重複登録や記事が消えてしまう問題に対応しました。このため、このエラーを避けるためにはバージョンアップしていただくのが最も良い方法ですが、バージョンアップができない場合は、このページでご紹介する方法で、キー操作（※）によるページの再読み込みが行われないようにして下さい。

なお、ブラウザの「リロード」ボタンなどを押して再読み込みした場合は問題を回避できません。

※制限対象とするキー操作

  • F5（Windows）
  • コントロールキー（Ctrl）+R（Windows）
  • コマンドキー（Command）+R（Macintosh）

設定方法

templates/admin/1.html の編集

templates/admin/1.html を編集して、ファイル末尾の </body> タグの直前に以下のコードを追加して下さい。

コピー 
<!-- ここから追加： F5 と Ctrl+R、Command+R によるリロードを抑える -->
<!-- Windows Safari の F5 の場合は問題の出ない再読み込みを行う -->
<script type="text/javascript">
var if_ctrl = 0;
var if_r = 0;
function is_ctrl(pressKey){
        if(pressKey==17){ //ctrl
                return 1;
        } else if (navigator.userAgent.match(/macintosh/i)){
                if (pressKey == 224 && navigator.userAgent.match(/firefox/i)){
                        return 1;
                } else if (pressKey == 91 || pressKey == 93){
                        return 1;
                }
        }
        return 0;
}
function disable_reload(e){
        if(navigator.userAgent.match(/msie/i) && window.event){
                window.event.returnValue=false;
                window.event.keyCode=0
        } else
        if (navigator.userAgent.match(/macintosh/i) || e.preventDefault){
                e.preventDefault();
                e.stopPropagation();
        }
        return false;
}
function catchkeydown(e){
        var pressKey;
        if (eval(e)){
                pressKey=e.keyCode;
        } else {
                pressKey=event.keyCode;
        }
        if(is_ctrl(pressKey)==1){ //ctrl
                if_ctrl=1;
                if(if_r==1){return disable_reload(e);}
        }
        if(pressKey==82){ //r
                if_r=1;
                if(if_ctrl==1){return disable_reload(e);}
        }
        if(pressKey==116){ //f5
                if (navigator.userAgent.match(/safari/i) 
                        && !navigator.userAgent.match(/chrome/i)){
                        window.location="%_myname_%?n=%_n_%&i=%_i_%";
                        return true;
                } else {
                        return disable_reload(e);
                }
        }
}
function catchkeyup(e){
        var pressKey;
        if (eval(e)){
                pressKey=e.keyCode;
        } else {
                pressKey=event.keyCode;
        }
        if(is_ctrl(pressKey)==1){ //ctrl
                if_ctrl=0;
                if(if_r==1){return disable_reload(e);}
        }
        if(pressKey==82){ //r
                if_r=0;
                if(if_ctrl==1){return disable_reload(e);}
        }
        if(pressKey==116){ //f5
                if (navigator.userAgent.match(/safari/i) 
                        && !navigator.userAgent.match(/chrome/i)){
                        window.location="%_myname_%?n=%_n_%&i=%_i_%";
                } else {
                        return disable_reload(e);
                }
        }
}
document.onkeydown = catchkeydown;
document.onkeyup = catchkeyup;
</script>
<!-- ここまで追加： F5 と Ctrl+R、Command+R によるリロードを抑える -->

※ Windows の Safari で F5 による再読み込みを行った時は再読み込みの停止ができません。代替案として、安全な方法（「一覧を最新に更新」ボタン押下と同じ操作）で再読み込みされます。

アップロードと確認

編集したファイルをサーバに上書きアップロードして下さい。アップロード後、管理画面を表示し、キーボードからの入力ではページが再読み込みされない事を確認して下さい。

ブラウザによっては期待通り動作しない可能性がありますので、運用時は期待通り動作するブラウザを推奨ブラウザとして下さい。

広告