From 026cb634ecf9162dbec28e04f685f123821d199f Mon Sep 17 00:00:00 2001
From: wukko <me@wukko.me>
Date: Wed, 18 Sep 2024 20:11:47 +0600
Subject: [PATCH] web: update & move csp to `svelte.config.js`

ough
---
 pnpm-lock.yaml                     |  3 +++
 web/package.json                   |  1 +
 web/src/routes/_headers/+server.ts | 21 ---------------
 web/svelte.config.js               | 43 ++++++++++++++++++++++++++----
 4 files changed, 42 insertions(+), 26 deletions(-)

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 9d316277..90995fb6 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -140,6 +140,9 @@ importers:
       compare-versions:
         specifier: ^6.1.0
         version: 6.1.1
+      dotenv:
+        specifier: ^16.0.1
+        version: 16.4.5
       eslint:
         specifier: ^8.57.0
         version: 8.57.0
diff --git a/web/package.json b/web/package.json
index 67c779bc..2d4a3e61 100644
--- a/web/package.json
+++ b/web/package.json
@@ -33,6 +33,7 @@
         "@types/fluent-ffmpeg": "^2.1.25",
         "@types/node": "^20.14.10",
         "compare-versions": "^6.1.0",
+        "dotenv": "^16.0.1",
         "eslint": "^8.57.0",
         "glob": "^10.4.5",
         "mdsvex": "^0.11.2",
diff --git a/web/src/routes/_headers/+server.ts b/web/src/routes/_headers/+server.ts
index 708d69ac..cdeb1f9c 100644
--- a/web/src/routes/_headers/+server.ts
+++ b/web/src/routes/_headers/+server.ts
@@ -1,29 +1,8 @@
-import env from "$lib/env";
-
-const allowedScriptOrigins = [
-    "'self'",
-    "challenges.cloudflare.com",
-    env.PLAUSIBLE_HOST ? env.PLAUSIBLE_HOST : ""
-]
-
 export async function GET() {
-    const CSP = {
-        "connect-src": ["*"],
-        "default-src": ["'self'"],
-
-        "script-src": allowedScriptOrigins,
-        "script-src-attr": allowedScriptOrigins,
-        "frame-src": ["challenges.cloudflare.com"],
-    }
-
     const _headers = {
         "/*": {
             "Cross-Origin-Opener-Policy": "same-origin",
             "Cross-Origin-Embedder-Policy": "require-corp",
-            "Content-Security-Policy":
-                Object.entries(CSP).map(
-                    ([directive, values]) => `${directive} ${values.join(' ')}`
-                ).flat().join("; "),
         }
     }
 
diff --git a/web/svelte.config.js b/web/svelte.config.js
index 52263871..28602c1e 100644
--- a/web/svelte.config.js
+++ b/web/svelte.config.js
@@ -1,8 +1,10 @@
-import adapter from '@sveltejs/adapter-static';
-import { mdsvex } from 'mdsvex';
-import { fileURLToPath } from 'node:url';
-import { dirname, join } from 'node:path';
-import { sveltePreprocess } from 'svelte-preprocess';
+import "dotenv/config";
+import adapter from "@sveltejs/adapter-static";
+
+import { mdsvex } from "mdsvex";
+import { fileURLToPath } from "node:url";
+import { dirname, join } from "node:path";
+import { sveltePreprocess } from "svelte-preprocess";
 
 /** @type {import('@sveltejs/kit').Config} */
 const config = {
@@ -46,6 +48,37 @@ const config = {
             precompress: false,
             strict: true
         }),
+        csp: {
+            mode: "hash",
+            directives: {
+                "connect-src": ["*"],
+                "default-src": ["none"],
+
+                "font-src": ["self"],
+                "style-src": ["self", "unsafe-inline"],
+                "img-src": ["self", "data:"],
+                "manifest-src": ["self"],
+                "worker-src": ["self"],
+
+                "object-src": ["none"],
+                "frame-src": [
+                    "self",
+                    "challenges.cloudflare.com"
+                ],
+
+                "script-src": [
+                    "self",
+                    "wasm-unsafe-eval",
+                    "challenges.cloudflare.com",
+
+                    // eslint-disable-next-line no-undef
+                    process.env.WEB_PLAUSIBLE_HOST ? process.env.WEB_PLAUSIBLE_HOST : "",
+
+                    // hash of the theme preloader in app.html
+                    "sha256-g67gIjM3G8yMbjbxyc3QUoVsKhdxgcQzCmSKXiZZo6s=",
+                ]
+            }
+        },
         env: {
             publicPrefix: 'WEB_'
         },