ETag для серверных отрендеренных страниц, содержащих одноразовые номера CSP

Question

У меня есть приложение React на стороне сервера, и Node / Express до сих пор смогли сгенерировать правильные, стабильные ETag , позволяющие использовать преимущества кэширования на стороне клиента.

Кроме того, сгенерированный HTML содержит фрагменты CSS для блокировки рендеринга (выше сгиба) и JS , встроенные в виде <script> и <style> тегов для более быстрого первого рендеринга на стороне клиента (как продвигается * 1009).* Google и его инструменты PageSpeed ​​и Lighthouse).

Теперь я хочу включить Политика безопасности контента (CSP) , и я предоставляю nonce в качестве атрибута для этих <script> и <style> теги на каждом запросе страницы, чтобы избежать нарушений unsafe-inline.Однако постоянно меняющийся одноразовый номер заставляет ETag меняться и при каждом запросе.HTML никогда не кэшируется, и каждый запрос попадает на мой сервер Express.

Есть ли способ объединить одновременно:

• встроенные функции CSS и JS
• CSP (то естьnonce или аналогичный)
• ETag или альтернативы

?

Пока что я вижу противоречие между текущими показателями производительности и рекомендациями по безопасности.

Есть ли эквиваленты одноразового номера CSP или может быть предоставлен одноразовый номер CSP при сохранении HTML нетронутым?Есть ли способ кэшировать страницы, содержащие nonce CSP?

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

Answer 1

Одним из решений является передача всей генерации контента и кэширования веб-приложению (в вашем случае Node), а генерация одноразовых номеров CSP - интерфейсному веб-серверу (например, Nginx).Я реализовал это с Django, который выполняет кэширование страниц с ETag, выполняет всю логику заголовка Vary и т. Д., И HTML-код, который он генерирует, содержит такой статический заполнитель одноразового номера CSP:

< script nonce="+++CSP_NONDE+++"> ... </script>

Этот заполнитель тогдазаполненный Nginx с использованием ngx_http_subs_filter_module:

sub_filter_once off;
sub_filter +++CSP_NONCE+++ $ssl_session_id;
add_header Content-Security-Policy "script-src 'nonce-$ssl_session_id'";

Я видел решения, использующие дополнительный модуль Nginx для генерации действительно уникального случайного одноразового номера для каждого запроса, но я считаю, что это излишнее, и я просто использую TLSидентификатор сеанса, который уникален для каждого подключающегося клиента и может кэшироваться в течение некоторого времени (например, 10 минут) в зависимости от конфигурации Nginx.

Просто убедитесь, что веб-приложение возвращает несжатый HTML, поскольку Nginx не сможетсделать подстановку строк.