Как (лакировать) кэшировать изображения webp на основе заголовка accept - PullRequest
1 голос
/ 12 июня 2019

TLDR;

Я обновляю свой устаревший сервер клиентов, но у меня возникают проблемы с кэшированием (или нет) изображений webp на основе заголовка подтверждения браузера. Лак кэширует изображение webp до тех пор, пока кто-нибудь со старым браузером не зайдет на сайт. После этого все (совместимые с webp) браузеры получают кешированное изображение jpg.

Настройка сервера

  • Ubuntu 18.04.2
  • Nginx как терминатор ssl (: 443)
  • Лак для более быстрой передачи (: 80)
  • Apache2 в качестве бэкэнда из-за особых требований htaccess (: 8080)
  • Сайт Wordpress
    • Плагин "wprocket" для html-кэширования
    • Плагин "WebP Express" для динамического обслуживания изображений webp (режим по умолчанию)
    • Ядро и плагины обновлены

Выпуск

Когда веб-сайт, поддерживающий браузер, посещает веб-сайт (второй визит после очистки кэша лака), он получает изображение с расширением .jpg, но когда вы проверяете заголовки на предмет типа контента, он говорит «image / webp», так же, как Плагин "WebP Express" говорит, что должен. Лаковое бревно - «хит», так что все работает нормально. Но когда я сейчас получаю изображение в IE, например (не поддерживает webp), возвращаюсь в Chrome и обновляю тип содержимого в заголовке, теперь он говорит «image / jpg» и регистрирует попадание лака. Это нежелательное поведение. Он должен просто обслуживать изображения webp в совместимых браузерах и jpg-версию в старых браузерах. Но они должны быть в кеше, потому что ... (читай ниже)

Нежелательное решение

Я изменил свой default.vcl файл, чтобы исключить png|jpe?g|webp файлы из кэширования. Это «исправляет» проблему, но снова увеличивает время загрузки. Среднее время загрузки тестового изображения с лаком: +/- 20 мс. Среднее время загрузки того же тестового изображения без лака: +/- 120 мс. Я знаю, что разница невелика, но на некоторых страницах галереи это заметно. Поэтому кеш лака должен быть включен.

Что я пробовал

Добавление проверки webp в default.vcl, который я получил от: https://github.com/igrigorik/webp-detect/blob/master/varnish.vcl -> Кажется, ничего не делает? (Да я перезапустил лаковый сервис)

Попробовал подход "Я на NGINX" из часто задаваемых вопросов от плагина "WebP Express", но я застрял на первом этапе этого подхода. И я все еще думаю, что это неправильный подход, потому что он будет зацикливать лак arround вместо подачи правильной версии через лак.

Мой вопрос

Как мне подойти к этому? Это что-то с настройками плагина "WebP Express"? Это то, что я должен добавить в файл default.vcl (это будет проще всего). Может быть, сочетание обоих? Или может быть что-то совершенно другое? Я застрял, и любые предложения приветствуются.

1 Ответ

1 голос
/ 13 июня 2019

Я и мой коллега потратили больше времени на тестирование и исследование этого, и мы, кажется, нашли решение.

Мы просто добавили следующие 3 строки в .htaccess серверной части apache2:

# Fix for serving webp in compatible browsers with "webp express" wordpress plugin
<IfModule mod_headers.c>
    Header append Vary "content-type"
</IfModule>

После этого перезапустите службу лака, и вы также увидите ее в заголовках.

Теперь лак последовательно обслуживает изображения webp в Chrome и других совместимых браузерах, а также jpg в IE и других несовместимых браузерах..

...