Есть ли способ заставить Vue.js правильно работать с CSP?
Когда я запускаю свое приложение spa (полученное в результате npm run generate с Nuxt.js), я получу несколько предупреждений, таких каккак эти:
Отказался от применения встроенного стиля, поскольку он нарушает следующую директиву политики безопасности содержимого: "style-src 'self' 'строго-динамический' 'nonce-124lk5fjOc4jn7qqLYEsG2jEvxYuqu8J' 'unsafe-inline' https:». Обратите внимание, что «unsafe-inline» игнорируется, если в списке источников присутствует значение хеша или одноразового номера.
Зная CSP , существует два правильных способа исправить это:
Использование одноразовых номеров, где Vue.js должен подписывать все созданные сценарии и стили с атрибутом nonce. Но я не думаю, что это что-то решит, так как кажется, что какой-то CSS добавлен в строку.
Использование хэшей, что на самом деле является предпочтительным способом сделать это, так как хеш защищает точното, что мы хотим, чтобы клиент выполнял в браузере.
Однако для использования хешей Vue.js / Webpack должен иметь возможность вычислять хеш для всех своих сценариев и стили и:
- для каждой компиляции, сообщите об этом разработчику, который затем добавит эти хэши в файл конфигурации NGINX,
или
- может генерировать метатеги , содержащие хэши, что делает этот процесс на 100% прозрачным для разработчика, который этого не делаетнужно настроить что-нибудь еще, чтобы гарантировать хорошую защиту CSP.
Поддерживает ли Vue.js это каким-либо образом? Есть ли кто-нибудь в мире, кто мог заставить CSP работать с Vue.js без «unsafe-inline»?