Очистите Angular JS templateCache один раз (для каждого развертывания)

Эта проблема AngularJS отключить частичное кэширование на компьютере-разработчике предлагает использовать $templateCache.removeAll() для очистки шаблоны кеша. Однако что, если вы просто хотите запускать это один раз в каждом цикле развертывания, чтобы браузеры посетителей обновляли/обновляли шаблон? Наша проблема заключалась в том, что некоторые браузеры не обновляли html-файлы шаблонов, и в итоге мы получали новый CSS, смешанный со старым HTML. Я не хочу, чтобы эта функция срабатывала все время, что с самого начала разрушило бы точку шаблонов кеша (правильно?).

В соответствии с вопросом заголовка, каков рекомендуемый способ очистки $templateCache «один раз», например, некоторые идеи, которые я хрустел:

  • Есть ли в Angular внутренний метод определения изменения файла шаблона? А потом, если так, "обновить" его.
  • Есть ли у Angular внутренняя «версия» или «дата», которую мы могли бы сравнить и добавить условную функцию для запуска функции removeAll ()?
  • Знает ли когда-нибудь сам $templateCache об обновлении? Каковы были намерения создателя Angular, навязывая нам templateCache, если файлы HTML должны изменяться со временем и обслуживаться несколькими браузерами.

Я не хочу использовать grunt, чтобы добавлять накладные расходы рабочего процесса для чего-то, что происходит периодически, или разбивать шаблоны html-файлов на переменные. (Это хороший метод для очистки кеша шаблонов? в угловом?)

Альтернативой, которую я вижу, является просто добавление и удаление кода removeAll() вручную, что было бы глупо.


deployment javascript caching angularjs refresh
person ericjam    schedule 02.06.2015    source источник
comment
привет, сжиженный, было бы здорово услышать, если бы вам удалось найти практическое решение для этого!   -  person Rich    schedule 10.12.2015

Ответы (2)


arrow_upward
1
arrow_downward

Мы решили просто привязать версию временной метки UNIX к файлам, которые были изменены, например file.php?v=154325232. Причина в том, что мы на самом деле не использовали Angular templateCache, поскольку мы не хранили сами данные шаблона внутри templateCache. Я думал, что Angular автоматически сохраняет любые асинхронно загруженные файлы шаблонов директив в templateCache, но это не так, вам нужно явно использовать templateCache для получения файла (хороший учебник по этому https://thinkster.io/templatecache-tutorial).

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

$modifiedTs = filemtime($filename);
if ($modifiedTs != $lastModificationTs){
  echo "$filename?v=" . time();
}

Как проверить, изменился ли файл?

Наконец, как я прочитал templateCache, он не предназначен для сохранения данных между сеансами браузера, а служит службой кэширования во время сеанса. Это не имеет ничего общего с кешем браузера, скорее Angular хранит его внутри. Таким образом, он предназначен для веб-сайтов, которые динамически перемещаются и загружают URL-адреса (т. Е. Не настоящее обновление страницы, а трюк AJAX), как сегодня работает большинство веб-сайтов Google.

person ericjam    schedule 10.12.2015

arrow_upward
0
arrow_downward

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

Вы можете установить gulp-ng-html2js и сделать это задачей gulp. Это выведет файл скажем templates.js, который вы затем добавите в заголовок.
https://www.npmjs.com/package/gulp-ng-html2js

Затем вызовите его в своем приложении как зависимость модуля. app.module('myApp',['templates']);

Поэтому перед каждым развертыванием запускайте эту задачу gulp. И при необходимости добавьте строку запроса прерывателя кеша templates.js?v=123

person ericjam    schedule 11.11.2016