場合によっては、接続が遅く、ブラウザがサーバーに既に存在する画像を取得できない場合があります。
ブラウザが取得に失敗した画像のsrc URLをコピーして、新しいタブで開くと、画像に表示されているように画像が適切に読み込まれます。Chrome は画像を読み込んでコンソールに表示できます。
なぜこれが起こるのか、そしてこれをどのように解決するのか疑問に思っています。
このコードでキャッシュを防ぐためにいくつかのパラメーターを追加して、画像をリロードしようとしています
images[instance].onerror = function(){
repeatPreload(this, 5);
}
function repeatPreload(Image, timeout){
if(timeout > 0){
setTimeout(function(){
Image.src = Image.src.replace(/\?d=*[0-9]{6,}/g,"") + "?d=" + new Date().getTime();
console.log("Fail to load image : " + Image.src + " , timeout : " + timeout);
Image.onerror = repeatPreload(Image, timeout - 1);
},2000);
}else{
Image["error"] = 1;
}
}
エラーが発生したときに画像フォルダーを複製し、複製フォルダーから画像を取得しようとしましたが、常に失敗します。