Политика безопасности содержимого: angular и приложение для весенней загрузки в режиме Prod

Question

Я работаю над приложением весенней загрузки с приложением Angular в качестве фронтального приложения. Со спины я отправляю политику CSP, как указано выше

.and()
            .headers()
            .contentSecurityPolicy(default-src 'self'; frame-src 'self'; script-src 'self' 'unsafe-inline' https://storage.googleapis.com; style-src 'self' 'unsafe-inline'; img-src 'self'; font-src 'self' object-src; require-trusted-types-for 'script')

Когда я запускаю приложение на dev и меняю политику CSP, я получаю ошибки на консоли передней панели Angular, которая имеет вид нормальная вещь. Когда я запускаю приложение на prod, даже я меняю политику CSP с

default-sr c 'self'

приложение продолжает функционировать, что странно .

Итак, мои вопросы:

1. Где Angular получает политику CSP для кода?
2. В режиме prod. Можем ли мы иметь политику CSP ?

PS: я использую Angular версию 8.2.4

Answer 1

Где Angular получает политику CSP для кода?

Правильный ответ - нет, были. Angular код ничего не делает (и не должен знать) о заголовке Content-Security-Policy. Заголовок CSP - это инструкция для браузера , какие ресурсы и где он может взять.

Простой пример:

Content-Security-Policy: default-src https:

Когда браузер увидит эту директиву, он откажется загрузить что-нибудь из HTTP. Если вы пытаетесь получить свои сценарии из HTTP, angular даже не запустится из-за отсутствия доступных сценариев.

В режиме prod, у нас может быть политика CSP?

Да. CSP - очень полезный инструмент, который значительно повышает безопасность вашего приложения. Таким образом, если вы заботитесь о своем клиенте, CSP (а также политика функций) должны быть приняты во внимание.

Но настройка требует много времени. Я потратил день или два, чтобы найти лучшую комбинацию для себя.

Попробуйте эту (не забудьте настроить с помощью google.api):

default-src 'none'; img-src 'self' data:; font-src 'self'; connect-src 'self'; script-src 'self'; style-src 'self' 'unsafe-inline'; object-src 'none'

Надеюсь, это поможет!

upd

Здесь вы можете найти больше информации о CSP (и написано лучше)