Как заставить index.html загружаться с сервера в любых браузерах, используя код Angular 2, если он был кеширован

Question

В настоящее время я размещаю приложение Angular 2 на веб-сервере Apache 2.4, и в браузере клиента последние изменения веб-сайта не отображаются после развертывания нового производства! Я обнаружил, что index.html кэшируется браузером. Все ссылки на файлы css и angular bundle могут быть сделаны на index.html, так что это точка входа в приложение. У нас тысячи активных пользователей, поэтому мы не можем настаивать на том, чтобы они нажимали CTRL+F5 или hard reload.

Я проверил различные способы производственной сборки (например, Thread1 , Thread2 ), index.html также содержит следующие метатеги.

<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate">
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Expires" content="0">

Используя угловой код, я проверил разрыв кеша по параметру запроса, а также следил за хорошей практикой использования module.id в каждом компоненте.

@Component({
    ...
    moduleId: module.id,
    ...
})

Итак, мой вопрос,

1. Как в этом случае заставить браузер загружать новый index.html, используя Angular 2 code на всех компьютерах пользователя? - Если это возможно, пожалуйста, дайте мне знать, как мне справиться с этой проблемой.

Ваша помощь будет оценена по достоинству!

Answer 1

Проблема не в index.html, как сказал Андони, вы можете добавить случайный префикс автогенерации к именам файлов пакета.

Вы можете заархивировать его с помощью команды:

ng build-out-hashes all

Дополнительные параметры здесь:

https://angular.io/cli/build

Answer 2

Вы заставляете браузер получать новую версию HTML-страницы, но если вы генерируете последнюю версию пакета с тем же именем, ваш новый HTML-файл будет содержать старые файлы js и CSS.

Распространенной практикой является изменение имени пакета с помощью некоторого автоматически генерируемого кода, чтобы новая версия HTML и старая запрашивали разные файлы.(тайник кеша)