今日の作業は「jsキャッシュ防止」です。
いきなりですが、作成したコードは以下の通りです。
const now = new Date();
const year = now.getFullYear();
const month = now.getMonth() + 1;
const day = now.getDate();
const hour = now.getHours();
const min = now.getMinutes();
const sec = now.getSeconds();
var key = year + "_" + month + "_" + day + "_" + hour + "_" + min + "_" + sec;
$(document).ready(function(){
let paramIndex = location.href.indexOf('?');
if (-1 == paramIndex) {
location.replace(location.href + "?date=" + key);
return;
} else if (location.href.slice(paramIndex + 1) !== "date=" + key) {
location.replace(location.href.slice(0, paramIndex) + "?date=" + key);
return;
}
// js load
let scripts =['SF_utils.js?date=' + key
,'SF_base.js?date=' + key
,'SF_points.js?date=' + key
,'SF_plates.js?date=' + key
,'SF_cubes.js?date=' + key
,'SF_cubesIns.js?date=' + key
,'SF_Controls.js?date=' + key
,'SF_UI.js?date=' + key
,'SF_Life_CPU.js?date=' + key
,'SF_Life.js?date=' + key
,'SF_Land.js?date=' + key
,'SF_Steve.js?date=' + key
,'main.js?date=' + key];
function onloaded(e){
onload();
}
let len = scripts.length;
let i = 0;
(function appendScript() {
let script = document.createElement('script');
script.src = scripts[i];
if(typeof scripts[i] == "undefined"){
return false;
}
document.head.appendChild(script);
if (i++ < len) {
script.onload = function(e){
if (i == len) {
onloaded(e);
} else {
appendScript();
}
}
}
})();
});
昨日のCache BustingをJSに適用した形です。htmlの場合はhref.replaceで画面遷移しましたが、jsはタグを生成して動的に追加しています。
"onloaded"に処理が来た時点で、全てのjsが読み込まれた状態になっています。
イメージやcssなども同様の手法で行けると思います。
これでリロード地獄から解放されました!やった!
以上です!
本家デアゴGTR-NISMO箱積状況:2箱(33,34号)