Spec-Zone.ru › Angular.js 1.5

Улучшить эту документацию Просмотреть исходный код ngCsp

  1. директива в модуле ng

В Angular есть некоторые функции, которые могут конфликтовать с определёнными ограничениями, применяемыми при использовании правил CSP (Content Security Policy).

Если вы планируете реализовать CSP с этими правилами, то вы должны указать Angular, чтобы он не использовал эти функции.

Это необходимо при разработке таких вещей, как расширения Google Chrome или приложения Universal Windows Apps.

Следующие правила CSP по умолчанию влияют на Angular:

  • Использование eval(), Function(string) и аналогичных функций для динамического создания и выполнения кода из строк запрещено. Angular использует это в сервисе $parse для повышения скорости оценки выражений Angular на 30%. (Это правило CSP можно отключить с помощью ключевого слова CSP unsafe-eval, но это, как правило, не рекомендуется, так как это ослабит защиту, предоставляемую CSP.)

  • Использование встроенных ресурсов, таких как встроенные <script> и <style> элементы, запрещено. Это предотвращает приложениям от вставки пользовательских стилей непосредственно в документ. Angular использует это для включения некоторых правил CSS (например, ngCloak и ngHide). Чтобы эти директивы работали, когда правило CSP блокирует встроенные стили, вы должны вручную связать angular-csp.css в своём HTML. (Это правило CSP можно отключить с помощью ключевого слова CSP unsafe-inline, но это, как правило, не рекомендуется, так как это ослабит защиту, предоставляемую CSP.)

Если вы не предоставите ngCsp, то Angular пытается автоматически определить, блокирует ли CSP динамическое создание кода из строк (например, unsafe-eval не указано в заголовке CSP) и автоматически отключает эту функцию в сервисе $parse. Однако эта автоматическая проверка приводит к тому, что в консоли регистрируется ошибка CSP:

Refused to evaluate a string as JavaScript because 'unsafe-eval' is not an allowed source of
script in the following Content Security Policy directive: "default-src 'self'". Note that
'script-src' was not explicitly set, so 'default-src' is used as a fallback.

Эта ошибка не вредит, но раздражает. Чтобы предотвратить отображение ошибки, поместите директиву ngCsp на элемент HTML-документа, который появляется до тега <script>, загружающего файл angular.js.

Примечание: Эта директива доступна только в форме атрибутов ng-csp и data-ng-csp.

Вы можете указать, какие из функций Angular, относящиеся к CSP, должны быть отключены, указав значение атрибута ng-csp. Варианты следующие:

  • no-inline-style: это останавливает Angular от вставки CSS-стилей в DOM

  • no-unsafe-eval: это останавливает Angular от оптимизации $parse с небезопасным eval строк

Вы можете использовать эти значения в следующих комбинациях:

  • Отсутствие объявления означает, что Angular предположит, что вы можете использовать встроенные стили, но выполнит проверку на наличие unsafe-eval во время выполнения. Например, <body>. Это обратная совместимость с предыдущими версиями Angular.

  • Простой атрибут ng-csp (или data-ng-csp) сообщит Angular об отключении как встроенных стилей, так и unsafe eval. Например, <body ng-csp>. Это обратная совместимость с предыдущими версиями Angular.

  • Указание только no-unsafe-eval сообщит Angular, что мы не должны использовать eval, но можем вставлять встроенные стили. Например, <body ng-csp="no-unsafe-eval">.

  • Указание только no-inline-style сообщит Angular, что мы не должны вставлять стили, но можем выполнять eval — автоматическая проверка на unsafe eval не будет выполняться. Например, <body ng-csp="no-inline-style">.

  • Указание как no-unsafe-eval, так и no-inline-style сообщит Angular, что мы не должны вставлять стили и не должны использовать eval, что эквивалентно пустому атрибуту ng-csp. Например, <body ng-csp="no-inline-style;no-unsafe-eval">

Сводка по директиве

  • Эта директива выполняется на уровне приоритета 0.

Использование

  • как атрибут:
    <ANY>
    ...
    </ANY>

В этом примере показано, как применить директиву ngCsp к тегу html.

<!doctype html>
<html ng-app ng-csp>
...
...
</html>

© 2010–2017 Google, Inc.
Licensed under the Creative Commons Attribution License 4.0.
https://code.angularjs.org/1.5.11/docs/api/ng/directive/ngCsp

Spec-Zone.ru

Настройки Оффлайн Что нового Помощь О нас
Spec-Zone .ru
спецификации, руководства, описания, API