Мобильное веб-приложение не очищает кэш должным образом

Question

Я разрабатывал мобильное веб-приложение для iPad и столкнулся с проблемой при тестировании своего кода.

Время от времени и, казалось бы, наугад, iPad перестает корректно обновлять все библиотеки JS, которые я написал. После обновления некоторого кода и публикации изменений я заметил, что некоторые файлы были должным образом обновлены, а другие нет. Такое поведение сохраняется после многочисленных очисток кэша, циклов питания и переключений Wi-Fi.

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

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

Кто-нибудь знает, это известная проблема с iPad? Могу ли я что-нибудь сделать для решения этой проблемы?

Answer 1

Для меня решение заключается в добавлении ?v=1 в конце всех ваших ссылок Javascript и CSS. Я попробовал все до того, как увидел это в другом посте Stackru, и он работал напрямую!!! Это было о времени...

Answer 2

Я получил решение!

Но сначала проблема: iPad и iPhone не обновляют кеш при открытии приложения. Даже удаление приложения, очистка кэша Safari, перезапуск устройства и т. Д. Не работает.

И вот решение... таадаа!

Ваш манифест-файл ДОЛЖЕН измениться. Если это изменить, iPad / iPhone перезагрузит кеш. Так что просто напишите номер версии в вашем файле манифеста и измените его, когда вы что-то изменили:

# Version: 1.2

Таким образом, полный файл манифеста может выглядеть так:

CACHE MANIFEST

# Version 1.5

NETWORK:
*

CACHE:
index.html
jquery-1.7.2.min.js
images/logo.jpg

Он даже перезагружает такие вещи, как изображения, которые не записаны в файл манифеста. Я проверял это несколько раз.

Btw. не забудьте проверить свой манифест-файл с http://manifest-validator.com/

Мой источник это очень круто, как о автономных веб-приложений: http://gregsramblings.com/2012/05/28/html5-application-cache-how-to/

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

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

Но у меня сработало всегда с первой попытки.

Answer 3

Обойти эту проблему. Добавить ссылку на само веб-приложение, как...

<a href="javascript:top.frames.location.reload();">refresh</a>

Он работает так же, как кнопка перезагрузки в адресной строке iPhone/iPad Safari!

Answer 4

Я не могу убедиться, что кэш очищен должным образом, но у меня это сработало:

Для этого вам нужно разрешить Web Inspector на вашем устройстве iOS. Перейдите в "Настройки"> "Safari"> "Дополнительно"> "Веб-инспектор" (он должен быть активным), и вам нужно активировать меню разработчика в Safari на вашем компьютере. Выберите "Настройки"> "Дополнительно"> "Активировать разработчика".

1. Подключите устройство к компьютеру с помощью USB-кабеля
2. Перейдите в safari> Разработка> Имя вашего устройства> Проверить приложение (приложение должно быть запущено)
3. Откроется Инспектор на вашем компьютере для веб-приложения.
4. Пока инспектор открыт Очистить кеш (команда + alt + E)
5. С открытым инспектором обновите страницу на вашем компьютере (команда + R)

Каким-то образом кеш Webapp был очищен, и я получил некэшированный код.

Answer 5

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

В моем случае я не хотел ничего кэшировать. Вот как я решил проблему:

• Включить модуль Apache mod_expires на моем сервере
• Создать .htaccess файл в том же каталоге, что и индексный файл. Файл должен содержать строку ExpiresDefault A1,

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

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

Answer 6

У меня работает выключение и включение ipad - по крайней мере, на ios 5. не полностью выключить, просто используйте кнопку режима сна в верхней части ipad, а затем кнопку домой, чтобы снова включить его. добавление номера версии в конце файла также работает, но это становится довольно утомительным.

Answer 7

У меня точно такая же проблема с моими веб-приложениями на iPad - иногда, случайным образом, веб-приложение, работающее в автономном режиме, не обновляет определенный ресурс (файл HTML/CSS/JS), несмотря на то, что убивает все возможные приложения, удаляя Кэш и история Safari, перезагрузка, перезапуск Wi-Fi-соединения, обновление или удаление manifest файл или положить устройство в микроволновку; даже применение кувалды оказалось бесполезным.

Хотя я не нашел "кошерный" способ исправить это, всегда есть обходной путь - переименуйте ресурс.

Просто измените имя файла без обновления. Если у вас есть проблемы с, скажем, foobar.js не обновляется, переименуйте его в foobar2.js и обновите ссылки на этот ресурс в других файлах. Это, конечно, может быть проблемой, если вы знаете, что именно (особенно если после недельного развития вы находитесь в foobar12.js), но пока мы не увидим официальное исправление для iOS или рабочую технику обновления, я знаю, что это единственный способ запустить его.

Answer 8

У меня была точно такая же проблема.

Я попробовал различные предложения здесь, и добавил контроль кеша без удачи. Я попытался переименовать файл, который отказался обновить, но не повезло. Я попытался добавить манифест кэша (у меня был один раньше, но удалил его), но не повезло. И я попробовал все обычные вещи: удалить приложение, очистить кэш, перезагрузить, переустановить приложение, не повезло.

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

Answer 9

Чтобы решить эту проблему, вы должны добавить новые буквы с цифрами (а не только цифры) в конец ссылки следующим образом:

?v1
?x2
?z3

И каждый раз, когда вы хотите обновить свой скрипт, вы должны добавлять разные буквы и цифры (требуются разные буквы, потому что сегодня многие мобильные браузеры игнорируют все чистые числа в конце ссылки Javascript/CSS).

Answer 10

Я провел много дней, работая над этой проблемой. Это выглядело как ошибка рендеринга из-за некоторых случайных изменений, которые я сделал как в CSS, так и в HTML, таким образом, помещая кнопки в случайных местах на экране, делая приложение непригодным для использования.

Я определил, что CSS был кеширован, после нескольких дней тыкания и подталкивания, и наконец попытался переименовать файлы, о чем говорит @Neo. Я также изменил контроль кэша в своем файле.htaccess, так как я использовал старый.htaccess, который инструктировал браузер кешировать в течение года.

tl; dr: удалите контроль кеша ( mod_expires и mod_headers) для своих файлов веб-приложений и просто используйте манифест кеша, если вы этого еще не сделали. Затем переименуйте файлы и обновите ссылки в вашем HTML, и все будет хорошо.