fix(platform/router-outlet): replace inline styles with constructable…

… stylesheet Inline styles would require a nonce if CSP disallows 'unsafe-inline' styles.
SchweizerischeBundesbahnen · Oct 25, 2024 · 31e377e · 31e377e
1 parent 9d32613
commit 31e377e
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 6 deletions.
diff --git a/angular.json b/angular.json
@@ -207,7 +207,7 @@
             "development": {
               "buildTarget": "microfrontend-platform-testing-app:build:development",
               "headers": {
-                "Content-Security-Policy-Report-Only": "default-src 'self'; connect-src 'self' blob: http://localhost:4201 http://localhost:4202 http://localhost:4203 http://localhost:4204 http://localhost:5200; frame-src 'self' http://localhost:4201 http://localhost:4202 http://localhost:4203 http://localhost:4204 http://localhost:5200; font-src 'self' https://fonts.gstatic.com; style-src 'self' https://fonts.googleapis.com 'nonce-test'; script-src 'self' 'nonce-test';"
+                "Content-Security-Policy": "default-src 'self'; connect-src 'self' blob: http://localhost:* https://localhost:*; frame-src 'self' http://localhost:* https://localhost:*; font-src 'self' https://fonts.gstatic.com; style-src 'self' https://fonts.googleapis.com 'nonce-STATIC_NONCE'; script-src 'self' 'nonce-STATIC_NONCE';"
               }
             }
           },

diff --git a/apps/microfrontend-platform-testing-app/src/index.html b/apps/microfrontend-platform-testing-app/src/index.html
@@ -8,6 +8,6 @@
     <link rel="icon" type="image/x-icon" href="favicon.ico">
   </head>
   <body>
-    <app-root ngCspNonce="test"></app-root>
+    <app-root ngCspNonce="STATIC_NONCE"></app-root>
   </body>
 </html>
diff --git a/package.json b/package.json
@@ -37,13 +37,13 @@
     "microfrontend-platform-testing-app-ci:build": "ng build microfrontend-platform-testing-app --configuration=production-ci",
     "microfrontend-platform-testing-app:lint": "ng lint microfrontend-platform-testing-app",
     "microfrontend-platform-testing-app:4201:serve": "ng serve microfrontend-platform-testing-app --port 4201",
-    "microfrontend-platform-testing-app:4201:http-server": "cd dist/microfrontend-platform-testing-app-ci/browser && http-server --cors --silent --port 4201",
+    "microfrontend-platform-testing-app:4201:http-server": "cd dist/microfrontend-platform-testing-app-ci/browser && http-server --cors --silent --port 4201 --header Content-Security-Policy: \"default-src 'self'; connect-src 'self' blob: http://localhost:4201 https://localhost:4201; frame-src 'self' http://localhost:4201 https://localhost:4201; font-src 'self' https://fonts.gstatic.com; style-src 'self' https://fonts.googleapis.com 'nonce-STATIC_NONCE'; script-src 'self' 'nonce-STATIC_NONCE';\"",
     "microfrontend-platform-testing-app:4202:serve": "ng serve microfrontend-platform-testing-app --port 4202",
-    "microfrontend-platform-testing-app:4202:http-server": "cd dist/microfrontend-platform-testing-app-ci/browser && http-server --cors --silent --port 4202",
+    "microfrontend-platform-testing-app:4202:http-server": "cd dist/microfrontend-platform-testing-app-ci/browser && http-server --cors --silent --port 4202 --header Content-Security-Policy: \"default-src 'self'; connect-src 'self' blob: http://localhost:4202 https://localhost:4202; frame-src 'self' http://localhost:4202 https://localhost:4202; font-src 'self' https://fonts.gstatic.com; style-src 'self' https://fonts.googleapis.com 'nonce-STATIC_NONCE'; script-src 'self' 'nonce-STATIC_NONCE';\"",
     "microfrontend-platform-testing-app:4203:serve": "ng serve microfrontend-platform-testing-app --port 4203",
-    "microfrontend-platform-testing-app:4203:http-server": "cd dist/microfrontend-platform-testing-app-ci/browser && http-server --cors --silent --port 4203",
+    "microfrontend-platform-testing-app:4203:http-server": "cd dist/microfrontend-platform-testing-app-ci/browser && http-server --cors --silent --port 4203 --header Content-Security-Policy: \"default-src 'self'; connect-src 'self' blob: http://localhost:4203 https://localhost:4203; frame-src 'self' http://localhost:4203 https://localhost:4203; font-src 'self' https://fonts.gstatic.com; style-src 'self' https://fonts.googleapis.com 'nonce-STATIC_NONCE'; script-src 'self' 'nonce-STATIC_NONCE';\"",
     "microfrontend-platform-testing-app:4204:serve": "ng serve microfrontend-platform-testing-app --port 4204",
-    "microfrontend-platform-testing-app:4204:http-server": "cd dist/microfrontend-platform-testing-app-ci/browser && http-server --cors --silent --port 4204",
+    "microfrontend-platform-testing-app:4204:http-server": "cd dist/microfrontend-platform-testing-app-ci/browser && http-server --cors --silent --port 4204 --header Content-Security-Policy: \"default-src 'self'; connect-src 'self' blob: http://localhost:4204 https://localhost:4204; frame-src 'self' http://localhost:4204 https://localhost:4204; font-src 'self' https://fonts.gstatic.com; style-src 'self' https://fonts.googleapis.com 'nonce-STATIC_NONCE'; script-src 'self' 'nonce-STATIC_NONCE';\"",
 
     "microfrontend-platform-devtools:build": "ng build microfrontend-platform-devtools --configuration=development",
     "microfrontend-platform-devtools-vercel:build": "ng build microfrontend-platform-devtools --configuration=production-vercel",