Хромирование кеширования CSS, но не загрузка изображений внутри файла CSS

У нас есть странная проблема на работе, которая происходит только в хроме. Похоже, что css файл получает кеширование, а содержимое этого файла не загружается повторно.

Проблема заключается в том, что при использовании нового сеанса, например "private session", изображение "mainSprite.png" не отображается.

После некоторых тестов я считаю, что проблема связана с тем, что мы делаем перенаправления в начале, если пользователь не аутентифицирован. Из того, что я понимаю, он может не завершить загрузку спрайтов, связанных внутри файлов css. Он будет кэшировать недопустимый объект, как только начинается перенаправление, а затем на следующих страницах он не сможет отобразить правильное изображение, так как он кэшировал что-то неправильно.

Странная вещь заключается в том, что она фактически загружает изображение полностью в какой-то момент. Но похоже, что это не освежает его в памяти...

Я сделал тайм-аут в течение одной секунды, прежде чем начинать переадресацию при первой загрузке и правильно отображать изображения. Это быстрое исправление, и я не могу ожидать, что каждый компьютер загрузит за 1 секунду все изображения, содержащиеся в css.

изменить

Насколько я могу судить, это действительно похоже на состояние гонки. Я изменил порядок загрузки. Мы используем require.js. Вместо загрузки js после css, я запускаю загрузку js раньше. И изображения теперь загружаются правильно на моем локальном сервере.

если кто-то заинтересован в этом:

http://api.checklist.com

изменить 2

Если изображения не видны, открытие новых вкладок будет иметь ту же проблему. Закрытие браузера и повторное его открытие будут работать при первой загрузке, а изображения не загружаются, а загружаются из кеша, что означает, что перед закрытием браузера изображение действительно загружалось.

Ответы

Ответ 1

Похоже, проблема, исходящая от ваших перенаправлений, к сожалению, я не мог видеть ваш пример (ссылка не открывается). У Google Chrome действительно проблемы с кешированием, которые он раздражает во время разработки (очистить кеш, загрузить новый образ, сделать то же самое для нового изображения..), если вам нужно очистить кеш, попробуйте следующее:

попробуйте перейти на

хром://хром/настройки/clearBrowserData​​STRONG >

в браузере Chrome и проверьте параметры:

Очистить кеш (у меня также есть Очистить историю загрузки и Удалить файлы cookie и другие данные сайта и подключаемого модуля)

нажмите кнопку "Очистить данные о просмотре", она должна

Ответ 2

Все, что вам нужно сделать, - проследить свой список наличных денег через хром, и из того, что я вижу, является то, что вы получили эту ошибку, которая делает ее не кешированной:

Uncaught TypeError: Object [object Object] не имеет метода 'placeholder'

Итак, если вы хотите отслеживать, вы можете использовать автономный режим манифеста или трассировку через свой код.

Просто следуя и проверяя вашу страницу, я обнаружил, где ошибка:

file: scripts2.js Строка 20 → $('input [placeholder]'). placeholder();

который вам нужно проверить имя владельца места и изменить его здесь в этом теге.

Спасибо

Ответ 3

Я предполагаю, что ваше приложение server/backend имеет настройки маршрутов. Как эта игра! рамочный пример:

# Ignore favicon requests
GET     /favicon.ico                    404

# Map static resources from the /app/public folder to the /public path
GET     /public/                        staticDir:public

# Catch all
*       /{controller}                   {controller}.index

В соответствии с вашим резюме я предлагаю настроить статический маршрут папки (где изображения) в файле конфигурации или htaccess по вашему желанию, а затем проверить URL-адрес изображения в строке url браузера (с пустой сессией). Это должно сработать!

Ответ 4

Сначала я предлагаю вам сначала попытаться найти способы сужения перенаправления. Если бы это было возможно, я бы предположил, что было бы гораздо целесообразнее попытаться создать свой контент динамически на основе аутентификации пользователей с использованием таких языков, как PHP или ASP (просто для обозначения двух).

Классическим способом отключения кэширования на веб-странице является установка двух тегов <meta> внутри тегов <head> </head>. Однако вы должны отметить, что они технически не "правильно", поскольку они не являются частью какой-либо официальной документации по стандартам. Это также означает, что я снова склоняюсь к моему первому предложению найти лучшую систему доставки, которая, в свою очередь, должна предотвратить проблему.

Итак, для целей "тестирования" тегами будут:

<HEAD>
    <META HTTP-EQUIV="CACHE-CONTROL" CONTENT="NO-CACHE">
    <META HTTP-EQUIV="EXPIRES" CONTENT="0">
</HEAD>

Ответ 5

Возможно, я не понимаю ваш вопрос или дилемму (возможно, из-за отсутствия объяснений или из-за того, что я не вижу вашу страницу на этой ссылке с момента запуска Chrome), но есть пример, который я использовал здесь, который работает в Chrome просто используя Javascript/jQuery для загрузки вместо CSS:

http://jsfiddle.net/2Cgyg/6/

Использовать изображение по адресу: http://www.w3schools.com/cssref/img_tree.gif

И хотя принятый ответ не работал у меня в Chrome, это вопрос, который я получил jsFiddle выше, из:

Загрузить изображение из javascript

Все кэширование и т.д. не нужно и даже то, что вы не хотели бы делать, если ваши изображения когда-либо обновлялись до чего-то другого - они не будут отображаться без принудительного обновления, которое вы можете сделать только путем изменения файла имя, подобное этому, чтобы пользователи не видели ваше обновленное изображение:

myPic.jpg?MMDDYYYY

И вы можете установить дату в соответствии с датой, которую вы ее модифицируете.

Ответ 6

очистите историю своего браузера, как кеш, куки очистите временный интернет файл

Если проблема не решена, а затем переустановите браузер, ваша проблема будет решена определенно.