AngularJs заставляет браузер очищать кеш

Ответ 1

Вы можете использовать очень простое решение, которое заключается в добавлении хэша в ваши файлы сценариев. Каждый раз, когда приложение развертывается, вы автоматически загружаете свои файлы с помощью другого хэша с помощью задачи gulp/grunt. В качестве примера вы можете использовать gulp-rev. Я использую эту технику во всех своих проектах и ​​прекрасно работает, это автоматизировано в процессе сборки/развертывания, может быть решением для всех ваших проектов.

Генератор Yeoman для AngularJS generator-gulp-angular (это был мой генератор выбора), используя это решение, чтобы убедиться, что браузер загружает новый оптимизированный файл а не старый в кеше. Создайте демонстрационный проект и поиграйте с ним, и вы увидите его в действии.

Ответ 2

Как уже упоминалось выше, общим решением для решения проблем с кешем браузера является добавление к загруженным файлам ресурсов своего типа токена версии (номер версии, timestamp, hash и т.д.). Это касается случаев, когда пользователь загружает страницу или перезагружает ее. Как уже говорилось в задаче gulp, WebPack, некоторые бэкэнд-фреймворки как Asp.net MVC и т.д. Поддерживают эту функцию вместе с группировкой, минимизацией, обфускацией и т.д. Лучше использовать их для решения других связанных проблем.

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

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

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

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

Ответ 3

Если вы ищете действительно простое решение, и ваша IDE - это Visual Studio под С#, вы можете получить идентификатор сборки приложения и объединить его с URL-адресом файла js.

Сначала вы должны активировать инкремент для минорных версий, таких как:

Перейдите в свойства своего проекта, в разделе "Приложение" в новом окне нажмите "Информация о сборке" и добавьте "*" к версии сборки (последняя цифра, как описано на рисунке выше).

После этого добавьте новое свойство в свой код позади aspx, или в веб-сервис, или в webapi, и т.д.... для этого фрагмента кода, который я использую aspx:

    public string GetVersionApp => System.Reflection.Assembly.GetExecutingAssembly().GetName().Version.ToString();

Затем вызовите свойство через html и объедините значение как param в вашем файле url, например так:

<script type="text/javascript" src="App/RequestsList/directives/comment-directive.js?<%=GetVersionApp%>"></script>

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