Использование image.complete, чтобы найти, если изображение кэшируется на Chrome? - PullRequest
Новая
       0

Использование image.complete, чтобы найти, если изображение кэшируется на Chrome?

7 голосов
/ 21 октября 2011

Я пытался выяснить, кэшируется ли внешнее изображение в браузере с помощью 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, но всегда возвращает falseна Chrome.

Кто-нибудь есть идеи, как заставить его работать с Chrome?

1 Ответ

14 голосов
/ 21 октября 2011

Я переписал ваш код на обычном 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 и .height + .width дает ожидаемые результаты (FF 3.6.23, Chromium 14).

Весьма вероятно, что вы отключили кэширование в браузере Chrome.Если нет, проверьте HTTP-заголовки вашего обслуживаемого изображения (Cache-control присутствует?). Этот заголовок существует в примере Google

Если вы хотите определить, когда изображение (не) закончило загрузку, взгляните на этот вопрос .

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...