feat: Add CSP configuration to use CSPMiddleware and CSP nonce to script tags in several cshtml script

EnvelopeGenerator.Web/Program.cs

@@ -16,6 +16,7 @@ using EnvelopeGenerator.Web.Models;
 using DigitalData.Core.DTO;
 using System.Text.Encodings.Web;
 using Ganss.Xss;
+using EnvelopeGenerator.Web;
 
 var logger = LogManager.Setup().LoadConfigurationFromAppSettings().GetCurrentClassLogger();
 logger.Info("Logging initialized!");
@@ -183,15 +184,12 @@ try
     }
 
     app.UseHttpsRedirection();
-    app.UseStaticFiles();
 
     var csp = config["Content-Security-Policy"];
     if(csp is not null)
-        app.Use(async (context, next) =>
-        {
-            context.Response.Headers.Add("Content-Security-Policy", csp);
-            await next();
-        });
+        app.UseCSPMiddleware(csp);
+
+    app.UseStaticFiles();
 
     app.UseCookiePolicy();
 

EnvelopeGenerator.Web/Views/Home/EnvelopeLocked.cshtml

@@ -1,4 +1,7 @@
 @{
+    var nonce = _accessor.HttpContext?.Items["csp-nonce"] as string;
+}
+@{
     ViewData["Title"] = "Dokument geschützt";
     var userLanguage = ViewData["UserLanguage"] as string;
     var languages = ViewData["Languages"] as string[];
@@ -50,7 +53,7 @@
     </section>
 </div>
 <footer class="container" id="page-footer">&copy; SignFlow 2023-2024 <a href="https://digitaldata.works">Digital Data GmbH</a></footer>
-<script>
+<script nonce="@nonce">
     $(document).ready(function () {
         $('.select-flag').select2({
             templateResult: formatResult,

EnvelopeGenerator.Web/Views/Home/EnvelopeSigned.cshtml

@@ -1,7 +1,6 @@
 @{
     ViewData["Title"] = "Dokument unterschrieben";
 }
-
 <div class="page container p-5">
     <header class="text-center">
         <div class="icon signed">
@@ -12,10 +11,8 @@
         </div>
         <h1>Dokument erfolgreich signiert!</h1>
     </header>
-
     <section class="text-center">
         <p>Sie haben das Dokument signiert. Im Anschluss erhalten Sie eine schriftliche Bestätigung.</p>
     </section>   
 </div>
-
 <footer class="container" id="page-footer">&copy; SignFlow 2023-2024 <a href="https://digitaldata.works">Digital Data GmbH</a></footer>

EnvelopeGenerator.Web/Views/Home/ShowEnvelope.cshtml

@@ -1,4 +1,7 @@
-@using DigitalData.Core.DTO;
+@{
+    var nonce = _accessor.HttpContext?.Items["csp-nonce"] as string;
+}
+@using DigitalData.Core.DTO;
 @using EnvelopeGenerator.Application.DTOs;
 @model EnvelopeReceiverDto;
 @{
@@ -42,7 +45,7 @@
         </div>
     </div>
 </div>
-<script>
+<script nonce="@nonce">
     const collapseNav = () => {
         document.addEventListener('click', function (event) {
             var navbarToggle = document.getElementById('navbarToggleExternalContent');
@@ -66,7 +69,7 @@
 
     var envelopeKey = ViewData["EnvelopeKey"] as string;
 
-    <script>
+    <script nonce="@nonce">
         var base64String = "@Html.Raw(documentBase64String.TrySanitize(_sanitizer))";
         var byteCharacters = atob(base64String);
         var byteNumbers = new Array(byteCharacters.length);
@@ -82,5 +85,4 @@
         })
     </script>
 }
-
 <div id='app' style='background: gray; width: 100vw; height: 100vh; margin: 0 auto;'></div>

EnvelopeGenerator.Web/Views/Shared/_CookieConsentPartial.cshtml

@@ -1,4 +1,7 @@
-@using DigitalData.Core.DTO;
+@{
+    var nonce = _accessor.HttpContext?.Items["csp-nonce"] as string;
+}
+@using DigitalData.Core.DTO;
 @using Microsoft.AspNetCore.Http.Features
 @using Newtonsoft.Json.Serialization;
 @using Newtonsoft.Json;
@@ -10,7 +13,7 @@
 }
 @if (showBanner)
 {
-    <script>
+<script nonce="@nonce">
 @{
     var serializerSettings = new JsonSerializerSettings
     {
@@ -18,7 +21,7 @@
     };
     string serializedProps = JsonConvert.SerializeObject(_cookieSettings, serializerSettings);
 }
-        var props = @Html.Raw(serializedProps);
-        var cookieSettings = new BootstrapCookieConsentSettings(props)
-    </script>
+    var props = @Html.Raw(serializedProps);
+    var cookieSettings = new BootstrapCookieConsentSettings(props)
+</script>
 }

EnvelopeGenerator.Web/Views/Shared/_Layout.cshtml

@@ -29,4 +29,4 @@
     </main>
     @Html.AntiForgeryToken()
 </body>
-</html>
+</html>

EnvelopeGenerator.Web/Views/_ViewImports.cshtml

@@ -5,4 +5,5 @@
 @inject IStringLocalizer<Resource> _localizer;
 @inject System.Text.Encodings.Web.UrlEncoder _encoder
 @inject Ganss.Xss.HtmlSanitizer _sanitizer
+@inject Microsoft.AspNetCore.Http.IHttpContextAccessor _accessor
 @addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers

EnvelopeGenerator.Web/appsettings.json

@@ -11,9 +11,8 @@
     }
   },
   "PSPDFKitLicenseKey": null,
-  /*  recommended Content-Security-Policy for production:
-      "default-src 'self'; script-src 'self'; style-src 'self' 'unsafe-inline'; img-src 'self';"  */
-  "Content-Security-Policy": null,
+  /* The first format parameter {0} will be replaced by the nonce value. */
+  "Content-Security-Policy": "default-src 'self'; script-src 'self' 'nonce-{0}'; style-src 'self' 'nonce-{0}'; img-src 'self' data: https:; font-src 'self'; connect-src 'self' wss://localhost:44385 ws://localhost:61446; frame-src 'self'; media-src 'self'; object-src 'self';",
   "AdminPassword": "dd",
   "AllowedOrigins": [ "https://localhost:7202", "https://digitale.unterschrift.wisag.de/" ],
   "NLog": {

EnvelopeGenerator.Web/package-lock.json

@@ -1,37 +0,0 @@
-{
-  "name": "EnvelopeGenerator.Web",
-  "version": "1.0.0",
-  "lockfileVersion": 2,
-  "requires": true,
-  "packages": {
-    "": {
-      "name": "EnvelopeGenerator.Web",
-      "version": "1.0.0",
-      "license": "ISC",
-      "dependencies": {
-        "prettier": "^3.1.0"
-      }
-    },
-    "node_modules/prettier": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/prettier/-/prettier-3.1.0.tgz",
-      "integrity": "sha512-TQLvXjq5IAibjh8EpBIkNKxO749UEWABoiIZehEPiY4GNpVdhaFKqSTu+QrlU6D2dPAfubRmtJTi4K4YkQ5eXw==",
-      "bin": {
-        "prettier": "bin/prettier.cjs"
-      },
-      "engines": {
-        "node": ">=14"
-      },
-      "funding": {
-        "url": "https://github.com/prettier/prettier?sponsor=1"
-      }
-    }
-  },
-  "dependencies": {
-    "prettier": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/prettier/-/prettier-3.1.0.tgz",
-      "integrity": "sha512-TQLvXjq5IAibjh8EpBIkNKxO749UEWABoiIZehEPiY4GNpVdhaFKqSTu+QrlU6D2dPAfubRmtJTi4K4YkQ5eXw=="
-    }
-  }
-}

EnvelopeGenerator.Web/package.json

@@ -1,15 +0,0 @@
-{
-  "name": "EnvelopeGenerator.Web",
-  "version": "1.0.0",
-  "description": "",
-  "main": "index.js",
-  "scripts": {
-    "format": "npx prettier wwwroot/js --write"
-  },
-  "keywords": [],
-  "author": "",
-  "license": "ISC",
-  "dependencies": {
-    "prettier": "^3.1.0"
-  }
-}

EnvelopeGenerator.Web/prettier.config.mjs

@@ -1,8 +0,0 @@
-const config = {
-    trailingComma: "es5",
-    tabWidth: 2,
-    semi: false,
-    singleQuote: true,
-};
-
-export default config;