Как я могу кешировать мои приложения vue, развернутые в nginx?

Добрый день.

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

Как мне кэшировать бюст моих приложений vue, не меняя имя каждого файла и ссылки на компоненты, которые есть в моих приложениях? Есть ли простой в использовании плагин npm, который я могу добавить в свои проекты, или что-то, что я могу сделать перед запуском npm run build для создания их папок dist? Могу ли я сделать что-либо из этого, не вмешиваясь в мои файлы конфигурации webpack или nginx?


npm nginx vue.js caching
person Otorrinolaringologista -man    schedule 25.07.2019    source источник
comment
Возможный дубликат производственных сборок VueJS / браузера с кэшированием   -  person Nika Kurashvili    schedule 26.07.2019
comment
Мой вопрос на самом деле немного отличается, так как я не хочу связываться с моими файлами конфигурации webpack и nginx. Отредактирую вопрос соответственно.   -  person Otorrinolaringologista -man    schedule 26.07.2019
comment
Вы используете CDN, например, Cloudflare? Это аннулирует любые ваши попытки достичь своей цели, если вы не очистите его кеш также программно или с панели управления консоли. Если вы не используете CDN, единственное решение, которое я вижу, - это при каждом развертывании копировать файлы сборки в новый каталог, хотя это означает возиться с вашим файлом nginx.conf.   -  person Ric0    schedule 28.07.2019

Ответы (1)


arrow_upward
0
arrow_downward

Предполагая, что это не имеет ничего общего с service worker / pwa, решение может быть реализовано путем возврата версии внешнего интерфейса.

axiosConfig.js

axios.interceptors.response.use(
  (resp) => {
    let fe_version = resp.headers['fe-version'] || 'default'
    if(fe_version !== localStorage.getItem('fe-version') && resp.config.method == 'get'){
      localStorage.setItem('fe-version', fe_version)
      window.location.reload() // For new version, simply reload on any get
    }
    return Promise.resolve(resp)
  },
)

Полная статья здесь: https://blog.francium.tech/vue-js-cache-not-getting-cleared-in-production-on-deploy-656fcc5a85fe

person bragboy    schedule 02.07.2020