Принуждение одностраничного приложения для обновления

Для приложений с одной страницей какие методы существуют для принудительной перезагрузки страницы и/или файлов JavaScript при обновлении обновлений на сервере?

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

Мне интересно, есть ли более общепринятые методы, которые используют определенные функции HTTP или DOM.

Обновление

Я читаю об HTML5 Appcache. Похоже, что это больше ориентировано на приложения, которые могут запускаться без подключения к серверу. Я не думаю, что это могло бы быть актуальным для обновления ресурсов SPA (в том числе самой страницы) с сервера. Правильно ли я?

Ответы

Ответ 1

Вы можете использовать запрос long polling, чтобы знать, когда есть обновления, без необходимости выполнять запросы через определенные промежутки времени, и когда возвращается длинный запрос опроса, вы можете обновить всю страницу, поскольку старые файлы javascript и события будут связаны для элементов DOM, поэтому было бы проще просто перезагрузить страницу.

ИЗМЕНИТЬ

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

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

Вы можете легко отключить события с помощью jQuery: как отменить все события с помощью jquery Это работает для одного элемента DOM, вам нужно будет сделать это для каждого элемента DOM на странице.

Ответ 2

Если вы используете .NET, вы можете использовать SignalR, чтобы уведомить всех клиентов об обновлении, а затем вызвать перезагрузку в клиент.

Ответ 3

Вы можете запустить таймер, когда возвращается длинный опрос, и если пользователь:

A. выполняет запрос ajax

B. включает вкладки

C. неактивен в течение времени таймера

Вы можете вызвать обновление.

Это примерно так же близко, как и обновление одностраничного приложения, не входя в пользовательский режим, или попросить обновить страницу.

Ответ 4

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

Общие стратегии с applicationCache

  • Управляйте одним файлом, который вы обновляете с помощью уникальных хэшей для всех ваших ресурсов.
  • Создать уникальное имя файла кеша PER RELEASE, содержащего ваши (предполагаемые) статические ресурсы

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

JavaScript

appCache.addEventListener('obsolete', handleCacheEvent, false);

function handleCacheEvent()
{
   // magic here ... prompt user, force reload, etc.
}

HTML

<html manifest="http://yoursite/appinfo.semver-here.mf">

Если вы пошли с опцией # 1, то вы подписались на событие updateready:

appCache.addEventListener('updateready', handleCacheEvent, false);

Для начала вы можете сделать подстановочные записи и/или сохранить большинство своих активов, помеченных как ресурсы NETWORK, и постепенно вставлять их в область CACHE по мере того, как вам стало удобно.

См: