7

私は外部画像がjsを使用してブラウザにキャッシュされているかどうかを調べようとしています。これは私がこれまでに持っているコードです。

<html>
    <head></head>
    <body>

    <script src="http://code.jquery.com/jquery-1.4.2.min.js"></script>

    <script>

        function cached( url ) {
            $("#imgx").attr({"src":url});
            if(document.getElementById("imgx").complete) {
                return true;
            } else {
                if( document.getElementById("imgx").width > 0 ) return true;
            }

            return false;
        }

    </script>

    <img id="imgx" src=""  />

    <script>

        $(document).ready(function(){
            alert(cached("http://www.google.com/images/srpr/nav_logo80.png"));
        });

    </script>

    </body>
</html>

Firefoxでは完全に機能しますが、Chromeでは常にfalseを返します。

誰かがそれをクロムで動作させる方法を知っていますか？

4

1 に答える 1

14

コードをプレーンJavaScriptで書き直して、jQueryからの独立性を高めました。コア機能は変更されていません。 フィドル： http： //jsfiddle.net/EmjQG/2/

function cached(url){
    var test = document.createElement("img");
    test.src = url;
    return test.complete || test.width+test.height > 0;
}
var base_url = "http://www.google.com/images/srpr/nav_logo80.png"
alert("Expected: true or false\n" +
      cached(base_url)
      + "\n\nExpected: false (cache-busting enabled)\n" +
      cached(base_url + "?" + new Date().getTime()));
//false = not cached, true = cached

初めて、私は得るfalse and false。コードを再度実行すると、が取得されtrue and falseます。

+を使用する.completeと、期待どおりの結果が得られます（FF 3.6.23、Chromium14）。.height.width

Chromeブラウザでキャッシュを無効にしている可能性があります。そうでない場合は、提供された画像のHTTPヘッダーCache-controlを確認してください（存在しますか？）。このヘッダーはGoogleサンプルに存在します

画像の読み込みが完了した（完了していない）ことを検出したい場合は、この質問をご覧ください。

于 2011-10-21T09:19:01.060 に答える