javascript — целостность подресурсов и методы очистки кэша в переполнении стека
Я хотел бы реализовать Подресурсная целостность а также очистка кеша для статических активов, таких как таблицы стилей и файлы JavaScript в моем приложении. В настоящее время я использую PHP с шаблонами Twig.
Я знаю, что существует множество инструментов для генерации хэшей для всех файлов JS и CSS, но я ищу, как реализовать хеши в <script> а также <link> теги для сотен файлов.
Этот пост в блоге Я описал большую часть того, что я пытаюсь сделать, однако автор описывает только разрушение кэша и использует статическую метку времени в имени файла, которую он каждый раз меняет вручную. Использование инструмента сборки для программной генерации этой временной метки также не сложно, но с помощью SRI значение представляет собой хеш, который отличается для каждого файла.
Например, фрагмент header.html.twig:
<!-- cdn requests -->
<script src='https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js'
integrity='sha384-8gBf6Y4YYq7Jx97PIqmTwLPin4hxIzQw5aDmUg/DDhul9fFpbbLcLh3nTIIDJKhx'
crossorigin='anonymous'></script>
<!-- same-origin requests -->
<script src='foo.1a516fba.min.js'
integrity='sha384-GlFvui4Sp4wfY6+P13kcTmnzUjsV78g61ejffDbQ1QMyqL3lVzFZhGqawasU4Vg+'></script>
<script src='bar.faf315f3.min.js'
integrity='sha384-+vMV8w6Qc43sECfhc+5+vUA7Sg4NtwVr1J8+LNNROMdHS5tXrqGWSSebmORC6O86'></script>
Изменение src/href а также integrity Атрибуты каждый раз, это не вменяемый подход.
Я мог бы написать функцию Twig, которая вызывает функцию PHP для хеширования файла каждый раз, и она может работать на ОК на dev, но это кажется ужасно дорогим в вычислительном отношении.
Каков подход к этому?
Решение
Чтобы ответить на ваш вопрос: не существует подходящего подхода, потому что это неправильное применение целостности субресурсов.
В соответствии с W3C атрибут целостности:
…механизм, с помощью которого пользовательские агенты могут проверить, что выбранный ресурс был доставлен без неожиданных манипуляций
Это было введено потому, что в наши дни многие страницы извлекают свои скрипты CSS и JS из CDN, как вы, и если бы хакер когда-либо получил контроль над CDN, он мог бы нанести невероятный ущерб тысячам веб-сайтов, внедрив вредоносный код в доставленные ресурсы!
Представьте, что каждая версия jQuery поставляется code.jquery.com или же ajax.googleapis.com вдруг содержал вредоносный код! Сколько сайтов будет затронуто? Страшно.
Предоставляя агенту (браузеру) хэш целостности, с которым следует сравнивать содержимое извлеченного ресурса, вы гарантируете, что агент продолжит выполнение кода, только если он получит именно то, что вы сказали ему ожидать. Если это не так, не верь!
В случае ресурсов в ваш приложение, я предполагаю, что они существуют на одном сервере, поэтому нет среднего маршрута для перехвата. Если хакер получает контроль над вашим сервером и внедряет вредоносный код в сценарии JS, он может также легко перефразировать содержимое и изменить атрибут целостности в вашем HTML. Subresource Integrity не предлагает никакой дополнительной проверки безопасности.
Но…
Если бы вы хотели динамически генерировать хеш для integrity атрибут:
Используйте Gulp (мои личные предпочтения), чтобы объединить, минимизировать и отобразить имя файла вашего ресурса. Прочитать содержимое сгенерированного файла, используя gulp.src('bar.*.min.js'), Использовать НПМ ша1 пакет для создания хэша в качестве переменной и, наконец, возможно, использовать Глоток-инъекционные изменить атрибут src, а затем глоток замена написать integrity атрибут тоже. Некоторый поток как это — то, для чего я пошел бы 🙂
Я надеюсь, что это отвечает на ваш вопрос.
Другие решения
Других решений пока нет …