@@ -1029,6 +1029,27 @@ have *one* importmap, so ``importmap()`` must be called exactly once.
1029
1029
If, for some reason, you want to execute *only * ``checkout.js ``
1030
1030
and *not * ``app.js ``, pass only ``checkout `` to ``importmap() ``.
1031
1031
1032
+ Using a Content Security Policy (CSP)
1033
+ -------------------------------------
1034
+
1035
+ If you're using a `Content Security Policy `_ (CSP) to prevent cross-site
1036
+ scripting attacks, the inline ``<script> `` tags rendered by the ``importmap() ``
1037
+ function will likely violate that policy and will not be executed by the browser.
1038
+
1039
+ To allow these scripts to run without disabling the security provided by
1040
+ the CSP, you can generate a secure random string for every request (called
1041
+ a *nonce *) and include it in the CSP header and in a ``nonce `` attribute on
1042
+ the ``<script> `` tags.
1043
+ The ``importmap() `` function accepts an optional second argument that can be
1044
+ used to pass attributes to the rendered ``<script> `` tags.
1045
+ You can use the `NelmioSecurityBundle `_ to generate the nonce and include
1046
+ it in the CSP header, and then pass the same nonce to the Twig function:
1047
+
1048
+ .. code-block :: twig
1049
+
1050
+ {# the csp_nonce() function is defined by the NelmioSecurityBundle #}
1051
+ {{ importmap('app', {'nonce': csp_nonce('script')}) }}
1052
+
1032
1053
The AssetMapper Component Caching System in dev
1033
1054
-----------------------------------------------
1034
1055
@@ -1107,3 +1128,5 @@ command as part of your CI to be warned anytime a new vulnerability is found.
1107
1128
.. _`dist/css/bootstrap.min.css file` : https://www.jsdelivr.com/package/npm/bootstrap?tab=files&path=dist%2Fcss#tabRouteFiles
1108
1129
.. _`dynamic import` : https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/import
1109
1130
.. _`package.json configuration file` : https://docs.npmjs.com/creating-a-package-json-file
1131
+ .. _Content Security Policy : https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP
1132
+ .. _NelmioSecurityBundle : https://symfony.com/bundles/NelmioSecurityBundle/current/index.html#nonce-for-inline-script-handling
0 commit comments